1

我有一个这样的循环：

for ( var current in all )
{
    //load the item
    prepare.load( all[current].resource , function( result ) { 
         doSomethingWithResult(result);
    });
}

function AllItemsLoaded()
{
}

我的目标是在所有项目加载后执行 AllItemsLoaded() 并执行回调中的代码，例如对于每个项目回调应该被调用并且 DoSomethingWithResult() 应该在 AllItemsLoaded() 被调用之前执行，所有这些项目都是异步加载的.

我试过 Jquery Deferred/pipe，我的代码如下所示：

var chain = new $.Deferred().resolve();

for ( var current in all )
{
                chain = chain.pipe(function(res){
                prepare.load( all[current].resource , function( result ) { 
                     doSomethingWithResult(result);
                });
            });
 //if I do a return here, the pipe will continue without getting the result, 
so I need to continue the pipe after load's callback and 
doSomethingWithResult is executed

}

chain.done(AllItemsLoaded);
4

4 回答 4

2

延期是个好主意。但是，您需要等待承诺。这是一种使用 when 等待所有承诺而不按顺序执行的方法：

var loads = [];

for ( var current in all )
{
        (function(){
    var deferred = new $.Deferred();
    prepare.load( all[current].resource , function( result ) { 
         doSomethingWithResult(result);
         deferred.resolve(result);
    });
    loads.push(deferred.promise());
        })();
}

$.when.apply(null, loads).then(AllItemsLoaded);

首先为每个负载创建一个新的延迟。将它的承诺放在一个集合中。加载后，解决延迟。使用 $.when() 等待所有负载。

于 2013-06-30T01:37:59.267 回答
1

这是你需要的吗？

来自：http ://aabs.wordpress.com/2009/12/16/sequential-script-loading-on-demand/

function LoadScriptsSequentially(scriptUrls, callback)
{
    if (typeof scriptUrls == 'undefined') throw "Argument Error: URL array is unusable";
    if (scriptUrls.length == 0 && typeof callback == 'function') callback();
    $.getScript(scriptUrls.shift(), function() { LoadScriptsSequentially(scriptUrls, callback); });
}
于 2013-06-30T01:23:03.480 回答
0

首先是使用.get()与否.post()，.load()原因是.load()返回 jQuery 而其他两个返回 jqXHR（即一个承诺），这就是你想要的。

接下来是提供一个数组来累积 jqXHR 承诺。

最后，您需要知道如何对$.when()一系列 Promise 采取行动，在所有 Promise 都已解决（或发生错误）时执行某些操作。

整个事情看起来像这样：

var promises = [];//new Array

for ( var current in all ) {
    prepare.get( all[current].resource, function( result ) {
         doSomethingWithResult(result);
    });
}

$.when.apply(null, promises).then(AllItemsLoaded, myErrorHandler);
于 2013-06-30T01:45:28.423 回答
0

我会这样处理它（如下），你$.get()用你自己的异步对象替换每个对象，用它自己的单独的完整处理程序。

$(document).ready(function() {

    $.when( 
        $.get("ajax.php?a=b"), 
        $.get("ajax.php?a=c"), 
        $.get("ajax.php?a=d")                   
    ).then(
        function() {
                // both AJAX calls have succeeded
                alert("All Done");
        }, 
        function() {
                // one of the AJAX calls has failed
                alert("One or more failed");
        }
    );
});
于 2013-06-30T01:41:39.380 回答