在RequireJS中使用jQuery.load

Question

I often bootstrap widgets I write like so:

$(window).load(function () {
  doStuff();
});

This is often the case as I write widgets that are dependent on the rest of the application to be initialized.

I recently started using RequireJS and am not able to figure out how to attach a callback as in the code above. I looked at and tried the domReady plugin however, it won't fit my use-case since the callbacks are invoked when the DOM is ready and not when all resources are loaded.

Here is what I have tried so far:

// Using domReady (main.js):
require(['require', 'domReady'], function (require, domReady) {
    'use strict';

    domReady(function () {
        require(['app'], function (App) {
            console.log(window);
            App.initialize();
        });
    });
});

// Using jQuery (main.js)
// Note, this does not work.
require(['jquery', 'app'], function ($, App) {
    'use strict';

    $(window).load(function () {
        App.initialize();
    });
});

Given the above, what is the correct way to achieve using $(window).load() with RequireJS?

Answer 1

If I understand you correct you can check $.holdReady() method to acheive the result; so just after load jquery run

jQuery.holdReady(true);

later attach your handlers which should run only after load with

jQuery(function($) {
    App.initialize();  //will run only after window.load;
}

and in your load handler setup:

jQuery(window).load(function () {
    jQuery.holdReady(false);  //fire all domready holded events
});