Javascript executes twice in Internet Explorer

Question

I currently ran into a problem where a lazy loaded javascript would execute twice using internet explorer - and ONLY internet explorer (currently version 9). Firefox and chrome works. Here is my code:

injectExternalJavaScript: function(fileUrl) {
    return jQuery.Deferred(function(deferred) {
        var script = document.createElement('script');
        script['src'] = fileUrl;
        script['type'] = 'text/javascript';
        var head = document.getElementsByTagName("head")[0];
        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;
                script['onload'] = script['onreadystatechange'] = null;
                head.removeChild(script);
                deferred.resolve();
            }
        };
        head.appendChild(script);
    }).promise();
}

I already found this posting and changed my code according to it but still ie is executing my script twice. You guys got any ideas?

Edit: This is my solution

injectExternalJavaScript: function(fileUrl) {
    return jQuery.Deferred(function(deferred) {
        var script = document.createElement('script');
        script['src'] = fileUrl;
        script['type'] = 'text/javascript';
        var head = document.getElementsByTagName("head")[0];
        var done = false;
        // Attach handlers for all browsers
        var cb = function() {
            if (!done && (!this.readyState || this.readyState === "loaded" || this.readyState === 'complete')) {
                done = true;
                script['onload'] = script['onreadystatechange'] = null;
                head.removeChild(script);
                deferred.resolve();
            }
        }
        if (script.addEventListener) {
            script.addEventListener('load', cb, false);
        } else {
            script['onreadystatechange'] = cb;
        }
        head.appendChild(script);
    }).promise();
}

As an alternative you may like the [head.js](http://headjs.com/) JS loader. — Barry Kaye, May 30 '12 at 14:08
This is no solution because I don't wan't to load any more scripts than necessary. — mayrs, May 30 '12 at 14:58

tastybytes · Accepted Answer · 2012-05-30T14:15:53.397

2

Try this

s = document.createElement("script");
s.src="myscript.js";
if(s.addEventListener) {
    s.addEventListener("load",callback,false);
}else if(s.readyState) {
    s.onreadystatechange = callback;
}
document.body.appendChild(s);
function callback() { console.log("loaded"); }

taken from http://msdn.microsoft.com/en-us/library/ie/hh180173(v=vs.85).aspx

which for you would be...

injectExternalJavaScript: function(fileUrl) {
    return jQuery.Deferred(function(deferred) {
        var script = document.createElement('script');
        script['src'] = fileUrl;
        script['type'] = 'text/javascript';
        var head = document.getElementsByTagName("head")[0];
        var done = false;
        // Attach handlers for all browsers
        var cb = function() {
            if (!done && (!this.readyState || this.readyState === "loaded" || this.readyState === 'complete')) {
                done = true;
                script['onload'] = script['onreadystatechange'] = null;
                head.removeChild(script);
                deferred.resolve();
            }
        };
        if ( script.addEventListener ) {
            script.addEventListener('load',cb, false);
        } else {
            script.onreadystatechange = cb;
        }
        head.appendChild(script);
    }).promise();
}

edited May 30 '12 at 14:15

answered May 30 '12 at 14:08

tastybytes

1,309
7
17

Did not work, still executing two times when I use your solution. – mayrs May 30 '12 at 15:00
Can you update your question with the script that is being executed? I can not replicate (in ie8, currently installing ie9 on my vm) the issue with either set of code. http://jsfiddle.net/3n1gm4/V9nMk/9/ – tastybytes May 30 '12 at 15:45
1

Okay after I changed some deferred's in the code it actually worked! I think there was a bug in the deferred itself rather than the injection function. Accepted your answer. Thanks for your help! – mayrs Jun 08 '12 at 06:16
2

@junior What were the changes that were made in order to make the code work? – B5A7 Sep 05 '12 at 23:56
@mearde Please take a look at my initial question, I added the working code at the bottom of the posting. – mayrs Sep 17 '12 at 12:47
That's nice that it works.. but why? Wtf was IE doing to mess this up? – Alkanshel Jan 04 '13 at 18:50

Javascript executes twice in Internet Explorer

1 Answers1