在循环结束前执行的循环内的AJAX调用

AJAX call inside a loop executed before loop ends

本文关键字：循环 调用 AJAX 执行 结束      更新时间：2023-09-26

我有以下问题:

我有一个循环:

// Code A
. . .
for (var key in dict){
    // Code B
    . . . 
    var list = this.initializeList();
    var selfRef = this;
    jQuery.ajax({
        dataType: 'json',
        url: '/someUrl',
        data: {'sent_data': sendData},
        success: function (recievedData){
            this.function(list);
        }
    });
    // Code C
    . . . 
}
// Code D
. . .

现在，理想的方式是如果代码的执行顺序是:

    代码
  2. for循环:
    • 代码B
      • AJAX
    • C代码
  3. 代码D

但是，问题是在循环的第2步:首先，执行代码B，然后是AJAX调用，然后是AJAX代码而不是代码C。在下一次迭代中，再次执行AJAX代码，而不是执行代码b。对我来说，执行顺序如上面列表中所示非常重要。如您所见，变量list应该为每个循环重新初始化，但是，我们有多个AJAX调用，只有第一个初始化。

如何解决这个问题?

您需要将$.ajax()设置为同步(而不是默认的异步)，如下所示:

$.ajax({
    ...
    async: false
});

这将导致脚本的执行等待，直到$。Ajax在继续执行脚本的其余部分之前完成。

我希望这对你有帮助!

AJAX(顾名思义)是异步的，这意味着它不是按照特定的顺序执行的。相反，AJAX调用在服务器响应初始调用时立即执行。要纠正这个问题，你可以在函数中添加延迟，或者在AJAX调用中添加回调，这样你就可以确保代码只在AJAX调用完全执行后才执行

将代码D放入回调的例子:

// Code A  
...
//run Code D if loop exhausted
var dCheckCount = 0;
function dCheck() { // will be called once for each ajax call
  dCheckCount++;
  if (dCheckCount === dict.length) { // # finished ajax calls = loop size
    // Code D
    ...
  }
}  
for (var key in dict) {  
  // Code B
  ...
  jQuery.ajax({
    dataType: 'json',
    url: '/someUrl',
    data: {'sent_data': sendData},
    success: function (recievedData){
        this.function(list);
        // Code C
        ...
        // check if can run Code D
        dCheck();
    }
  });
}
相关文章：