javascript - jQuery延迟对象

我正在开发“一个页面应用程序”，并且正在寻找一种方法来确保页面渲染完成。

我的应用程序流程如下：


绘制导航标记
添加一个叠加层，指示正在获取页面内容
实际加载内容并将其注入页面内容区域


现在这是我的不足之处：

页面内容注入后，我将初始化依赖于标记的窗口小部件（引导程序，自定义事件等）。

这意味着页面内容仍然可以被操纵，因此，我想知道是否
我可以将jQuery的延迟对象（以及如何使用）用作函数队列，并使用可以执行异步操作的函数以及普通的旧同步函数。

使用该方法，我希望能够知道何时所有小部件都已初始化，然后删除页面加载指示器。

最佳答案

您可以使用jQuery的延迟对象来创建异步函数队列。

这是一个示例实现（通过jsfiddle / coffeeandcode）：

var Queue = function() {
    var lastPromise = null;

    this.add = function(obj, method, args, context) {
        var methodDeferred = $.Deferred();
        var queueDeferred = this.setup();
        if(context === undefined) { context = obj; }

        // execute next queue method
        queueDeferred.done(function() {


            // call actual method and wrap output in deferred
            setTimeout(function() {
                obj[method].apply(context, args);
                methodDeferred.resolve();
            }, 100);


        });
        lastPromise = methodDeferred.promise();
    };

    this.setup = function() {
        var queueDeferred = $.Deferred();

        // when the previous method returns, resolve this one
        $.when(lastPromise).always(function() {
            queueDeferred.resolve();
        });

        return queueDeferred.promise();
    }
};

您可以在此处查看运行中的代码：

http://jsfiddle.net/coffeeandcode/yg9P6/