jQuery getScript() not resolving

Question

I am using jQuery's getScript() to load separate javascript files. The files seem to load fine (I know this as when I put an incorrect URL, it throws an error - no error with the correct URL).

However, the done()function does not seem to work. The console does not log 'done', nor do any of the functions get called.

(function($) {
    $.when(
        $.getScript( templateUrl + "/assets/js/variables.js" ),
        $.getScript( templateUrl + "/assets/js/functions.js" ),
        $.getScript( templateUrl + "/assets/js/events.js" ),
        $.Deferred(function( deferred ){
            $( deferred.resolve );
        })
    ).done(function(){

        console.log("done");

        swapBackgroundImgs();
        singleLarge();
        bindFlexorder();
        bindSvgeezy();
        bindPlaceholder();
        preloadImages();

    });
})( jQuery );

T.J. Crowder · Accepted Answer · 2013-07-28T10:20:57.253

1

The done callback is never triggered because you've explicitly created a Deferred and never resolved it. $.when waits for all of the promises to be resolved.

The code you have in your $.Deferred:

$( deferred.resolve );

...will schedule the Deferred's resolve function as a ready callback, but the function will get called with the wrong this (document rather than the Deferred object; more: Mythical methods), which probably makes it throw an error ready buries.

Simply remove that $.Deferred entirely, or if your goal is to wait for ready, make sure this gets set correctly when calling resolve:

$.Deferred(deferred) {
    $(function() {
        deferred.resolve();
    });
})

or:

$.Deferred(deferred) {
    $($.proxy(deferred.resolve, deferred));
})

or, but note the comment:

$.Deferred(deferred) {
    // Deprecated in jQuery 1.8
    $(document).on("ready", deferred, "resolve");
})

edited Jul 28 '13 at 10:20

answered Jul 28 '13 at 10:04

T.J. Crowder

1,031,962
187
1,923
1,875

What you've said makes sense. I found out about multiple getScript() from [this stack](http://stackoverflow.com/a/11803418/997596) which is why my code was like that. I've removed the `$.Deferred` yet still nothing in `done()` is getting called. Would it have anything to do with the jQuery function wrapper? – Fisu Jul 28 '13 at 10:24
@tommyf: It wouldn't be because of the wrapper in the code you've shown, but if you're also using that wrapper in the scripts you load, then yes: The functions in those scripts would not be accessible because they'd be nicely wrapped up in a scoping function. You'd have to make them available somehow, perhaps through a single shared object available as a global variable (`var App = {};` and then they add themselves to `App`), or by having them raise an event on an existing global (`document.body`) that passes a reference to them to listeners. – T.J. Crowder Jul 28 '13 at 10:34
the scripts loaded are all unwrapped. Via web inspector, I can see the loaded scripts are all viewable in the `XHRs` directory. Would they be accessible from there? – Fisu Jul 28 '13 at 11:32
Ok it seems there's a problem with one of my included scripts as when I comment all but one out the done callback works fine. Thanks for your help. – Fisu Jul 28 '13 at 11:48

jQuery getScript() not resolving

1 Answers1