web-dev-qa-db-fra.com

gestionnaire «onload» pour la balise «script» dans Internet Explorer

J'utilise cette fonction pour attacher le gestionnaire onload à une balise de script, il semble que ce soit la méthode recommandée sur Internet.
Pourtant, cela ne fonctionne pas dans Internet Explorer, si la page est déjà chargée (testé dans ie 8). Vous pouvez voir que cela fonctionne dans les navigateurs normaux (déclenche une alerte lorsque le script est chargé).

Suis-je en train de manquer quelque chose?
Merci

49
Nikita Rybak

Vous devez appeler jQuery.getScript , qui fait exactement ce que vous recherchez.

[~ # ~] modifier [~ # ~] : Voici le code source pertinent de jQuery:

var head = document.getElementsByTagName("head")[0] || document.documentElement;
var script = document.createElement("script");
if ( s.scriptCharset ) {
    script.charset = s.scriptCharset;
}
script.src = s.url;

// Handle Script loading
    var done = false;

// Attach handlers for all browsers
script.onload = script.onreadystatechange = function() {
    if ( !done && (!this.readyState ||
            this.readyState === "loaded" || this.readyState === "complete") ) {
        done = true;
        jQuery.handleSuccess( s, xhr, status, data );
        jQuery.handleComplete( s, xhr, status, data );

        // Handle memory leak in IE
        script.onload = script.onreadystatechange = null;
        if ( head && script.parentNode ) {
            head.removeChild( script );
        }
    }
};

// Use insertBefore instead of appendChild  to circumvent an IE6 bug.
// This arises when a base node is used (#2709 and #4378).
head.insertBefore( script, head.firstChild );
87
SLaks

J'ai également eu des problèmes avec script.onload = runFunction; dans IE8.

J'ai essayé jQuery.getScript et cela fonctionnait parfaitement pour mes besoins. Le seul inconvénient est d'attendre que jQuery soit chargé avant d'ajouter le script.

Cependant, comme mes fonctions de rappel utilisent jQuery de manière très intensive, je trouve que c'est un inconvénient extrêmement acceptable et très mineur car il crée une solution multi-navigateur très facile à utiliser.

Mise à jour:

Voici une façon de le faire sans utiliser jQuery:

(une solution modifiée de: https://stackoverflow.com/a/13031185/1339954 )

var url = 'http://ajax.googleapis.com/ajax/libs/swfobject/2.2/swfobject.js';
var headID = document.getElementsByTagName("head")[0];
var script = document.createElement('script');
script.type='text/javascript';
script.src=url;

//for nonIE browsers
script.onload=function(){
        addVideo();
    }

 //for IE Browsers
 ieLoadBugFix(script, function(){
     addVideo();}
 );

function ieLoadBugFix(scriptElement, callback){
        if (scriptElement.readyState=='loaded' || scriptElement.readyState=='completed') {
             callback();
         }else {
             setTimeout(function() {ieLoadBugFix(scriptElement, callback); }, 100);
         }


 }

headID.appendChild(script);
10
ngChris