Load Script with jQuery - IE fails

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 b开发者_C百科eforeSend 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.

---

jQuery has getScript

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

---

@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.

---

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)

---

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 */ });