Load Script with jQuery - IE fails

Question

i try to load a JavaScript dynamically with jQuery to initlialize my ajax-application. I want to get a handler-function called, when the script was loaded successfully. This is what my code looks like:

var $script = $('<script type="text/javascript"></script>').appendTo('head');
$script.load(function() { ... });
$script.error(function() { ... });
$script.attr('src', 'foo.js');

This works fine in FireFox, Opera, Safari and Chromium.
The onload-handler is always called after the script was loaded.
But the IE (v8) does neither call the onload-handler nor the onerror-handler. So my ajax-application gets never initialized ;-)

Does anyone know how to fix this problem?

Best Regards, Biggie

EDIT:
I think i got it working:

$.ajax({
    type: "GET",
    url: options.script,
    data: null,
    success: function(data, textStatus) {
        options.onload();
    },
    error: function(XMLHttpRequest, textStatus, errorThrown) {
        options.onerror();
    },
    beforeSend: function(xhr) {
        // Fix for FireFox 3 to prevent "malformed"-message
        if (xhr.overrideMimeType) {
            xhr.overrideMimeType("text/plain");
        }
    },
    dataType: "script"
});

The beforeSend is used to prevent the malformed-error in FireFox.

This seems to work with FireFox and IE. Both call the error-handler if the script does not exist.

as others have noted the 'onload' event is not triggered in IE. You should handle the onreadystatechange for IE to have it working. — Andreas, Oct 24 '10 at 14:28
@andreas: This should be automatically done by the `ajax`-function if i understand the jQuery-code correct: http://github.com/jquery/jquery/blob/master/src/ajax.js#L294 — Biggie, Oct 24 '10 at 14:52

score 3 · Answer 1 · answered Oct 24 '10 at 12:17

3

jQuery has getScript

jQuery.getScript( url, [ success(data, textStatus) ] )

answered Oct 24 '10 at 12:17

epascarello

204,599
20
195
236

1

But getScript has no onError-Handler. So there is no way to inform the user hat the initialize has failed. – Biggie Oct 24 '10 at 12:36
1

@Biggie "So there is no way to inform the user hat the initialize has failed." How about `textStatus`? – epascarello Oct 24 '10 at 12:50
Hm, if the requested file does not exist the success-function is not called (FireFox). Moreover the FireFox-log always shows an error like "malformed code" although the code works without problems. – Biggie Oct 24 '10 at 13:37

score 0 · Answer 2 · edited May 23 '17 at 11:56

0

@epascarello's answer is probably the most convenient way to go.

Other than that:

onerror doesn't work for script elements in IE. See detailed background in this question.

onload is supposed to work according to the MSDN. If it really doesn't, a workaround might be to execute the function in the JS that gets embedded.

edited May 23 '17 at 11:56

Community

1
1

answered Oct 24 '10 at 12:18

Pekka

442,112
142
972
1,088

score 0 · Answer 3 · edited May 24 '13 at 14:42

0

error won't work reliably in either case, however $.getScript() (and $.ajax() underneath) uses onreadystatechange as well to support IE, so you can do this:

$.getScript("foo.js", function() { /* run your app code */ });

edited May 24 '13 at 14:42

Jasper de Vries

19,370
6
64
102

answered Oct 24 '10 at 12:20

Nick Craver

623,446
136
1,297
1,155

score 0 · Answer 4 · answered Oct 19 '11 at 18:38

Almost 1 year later...

I made a little change in jquery source code to support correctly 404 error when calling a script.

Search in source for "jQuery.ajaxTransport( "script", function(s) {" and in the body of the function (I added before onload event) add:

[...]
// Attach error event handler
script.onerror = function(){ callback(0, "error"); };
[...]

This modification will fire the "error" callback. So you can create a fallback function for 404 error.

This is a dirty modification, but worked perfectly in most browsers that I tested (FF,Chrome,Webkit,IE7-9)

Load Script with jQuery - IE fails

4 Answers4