Javascript 有序异步AJAX调用

我正在创建一个执行多个功能的脚本，并希望在功能完成后更新用户。我将

$.ajax（）

调用嵌套在前一个调用的

success

块中的每个后续调用中

每个循环总共有4个调用。让我们把它们叫做

scan\u 1

到

scan\u 4

。

scan_1

的

success

块调用

scan_2

，依此类推

例如，假设我在3个对象上循环。我希望流程如下所示：

回路1

• 扫描1
• 扫描2
• 扫描3
• 扫描4

环路2

• 扫描1
• 扫描2
• 扫描3
• 扫描4

环路3

• 扫描1
• 扫描2
• 扫描3
• 扫描4

问题是它首先运行所有的

scan\u 1

调用。我一定是漏掉了什么，但我似乎想不出来。任何建议都将不胜感激

以下是一段

scan_1

（不相关的东西被剪掉）供参考：

for（var i=1；i它是异步的，“success”将在将来某个时候触发。脚本不会等待它响应。因为您在循环中触发了三个请求，它们都将是“scan1”

每次请求完成时都会调用“scan_2”

如果您想控制事件的顺序，请将请求更改为同步。
它是异步的-将来某个时候会触发“成功”。脚本不会等待它响应。因为您在循环中触发了三个请求，它们都将是“scan1”

每次请求完成时都会调用“scan_2”

如果您想控制事件的顺序，请将请求更改为synchronous。
您首先要同时发送三个ajax调用

扫描1（循环1）

扫描1（循环2）

扫描1（环路3）

每次扫描1完成后，将调用后续的扫描2，然后调用扫描3

实际上，您希望发生什么？扫描循环1的12和3，然后扫描循环2的12和3，然后扫描循环3的12和3？这将需要更多嵌套，或者可能需要延迟对象。
您首先要同时发送三个ajax调用

扫描1（循环1）

扫描1（循环2）

扫描1（环路3）

每次扫描1完成后，将调用后续的扫描2，然后调用扫描3

实际上，您希望发生什么？扫描循环1的12和3，然后扫描循环2的12和3，然后扫描循环3的12和3？这将需要更多的嵌套，或者可能需要延迟对象。
而不是对每个
$调用使用
成功
回调。ajax（）
可以存储每组ajax请求（它们的jqXHR对象）在数组中，并等待所有问题解决：

function scan_1 () {

    //setup array to store jqXHR objects (deferred objects)
    var jqXHRs = [];
    for(var i = 1; i <= 3; i++)
    {

        //push a new index onto the array, `$.ajax()` returns an object that will resolve when the response is returned
        jqXHRs[jqXHRs.length] = $.ajax({
            type:       'GET',
            url:        url,
            data:       'do=scan&step=1&' + string,
            dataType:   'json'
        });
    }

    //wait for all four of the AJAX requests to resolve before running `scan_2()`
    $.when(jqXHRs).then(function () {
        if(result.proceed == 'true') {
            scan_2();
        }
    });
}

功能扫描\u 1（）{
//用于存储jqXHR对象（延迟对象）的设置数组
var jqXHRs=[]；
对于（var i=1；i而不是对每个
$.ajax（）
调用使用
success
回调，您可以将每组ajax请求（它们的jqXHR对象）存储在一个数组中，并等待它们全部解析：

function scan_1 () {

    //setup array to store jqXHR objects (deferred objects)
    var jqXHRs = [];
    for(var i = 1; i <= 3; i++)
    {

        //push a new index onto the array, `$.ajax()` returns an object that will resolve when the response is returned
        jqXHRs[jqXHRs.length] = $.ajax({
            type:       'GET',
            url:        url,
            data:       'do=scan&step=1&' + string,
            dataType:   'json'
        });
    }

    //wait for all four of the AJAX requests to resolve before running `scan_2()`
    $.when(jqXHRs).then(function () {
        if(result.proceed == 'true') {
            scan_2();
        }
    });
}

功能扫描\u 1（）{
//用于存储jqXHR对象（延迟对象）的设置数组
var jqXHRs=[]；
for（var i=1；i听起来像是您需要的。它基本上允许您将多个事件处理程序链接到jQuery Ajax对象，并使您能够更好地控制何时调用回调

进一步阅读：




听起来像是您需要的。它基本上允许您将多个事件处理程序链接到jQuery Ajax对象，并使您能够更好地控制调用回调的时间

进一步阅读：




我在大量使用SharePoint web services时也遇到过类似的问题—您通常需要从多个来源提取数据，以便为单个流程生成输入

为了解决这个问题，我将这种功能嵌入到我的AJAX抽象库中。您可以轻松定义一个请求，该请求完成后将触发一组处理程序。但是，每个请求都可以通过多个http调用来定义。以下是组件（和详细文档）：


此简单示例使用三个调用创建一个请求，然后按照调用顺序将该信息传递给单个处理程序：

    // The handler function 
function AddUp(Nums) { alert(Nums[1] + Nums[2] + Nums[3]) }; 

    // Create the pool 
myPool = DP_AJAX.createPool(); 

    // Create the request 
myRequest = DP_AJAX.createRequest(AddUp); 

    // Add the calls to the request 
myRequest.addCall("GET", "http://www.mysite.com/Add.htm", [5,10]); 
myRequest.addCall("GET", "http://www.mysite.com/Add.htm", [4,6]); 
myRequest.addCall("GET", "http://www.mysite.com/Add.htm", [7,13]); 

    // Add the request to the pool 
myPool.addRequest(myRequest); 

请注意，与提供的许多其他解决方案不同，此方法不强制执行调用的单线程-每个调用仍将以同样快（或同样慢）的速度运行在环境允许的情况下，仅当所有处理程序都完成时才会调用单个处理程序。它还支持设置超时值，并在您的服务有点不稳定时重试

我发现它非常有用（从代码的角度来看，理解起来非常简单）。没有更多的链接，没有更多的计数调用和保存输出。只需“设置它并忘记它”.
我在大量使用SharePoint web services时也遇到过类似的问题-您通常需要从多个源提取数据，以便为单个流程生成输入

为了解决这个问题，我将这种功能嵌入到我的AJAX抽象库中。您可以轻松定义一个请求，该请求完成后将触发一组处理程序。但是，每个请求都可以通过多个http调用来定义。以下是组件（和详细文档）：


此简单示例使用三个调用创建一个请求，然后按照调用顺序将该信息传递给单个处理程序：

    // The handler function 
function AddUp(Nums) { alert(Nums[1] + Nums[2] + Nums[3]) }; 

    // Create the pool 
myPool = DP_AJAX.createPool(); 

    // Create the request 
myRequest = DP_AJAX.createRequest(AddUp); 

    // Add the calls to the request 
myRequest.addCall("GET", "http://www.mysite.com/Add.htm", [5,10]); 
myRequest.addCall("GET", "http://www.mysite.com/Add.htm", [4,6]); 
myRequest.addCall("GET", "http://www.mysite.com/Add.htm", [7,13]); 

    // Add the request to the pool 
myPool.addRequest(myRequest); 

请注意，与提供的许多其他解决方案不同，此方法不强制执行调用的单线程-每个调用仍将以同样快（或同样慢）的速度运行在环境允许的情况下，仅当所有处理程序都完成时才会调用单个处理程序。它还支持设置超时值，并在您的服务有点不稳定时重试

我发现它非常有用（而且非常容易理解）