循環結束前執行的循環內的AJAX調用

Question

我有以下問題：

我有一個循環：

// 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
. . .

現在，理想的方法是執行代碼的順序為：

1. 代碼A
2. for循環：
   • 代碼B
   • AJAX
   • 代碼C
3. 代碼D

但是，問題出在循環的第2步：首先，執行代碼B ，然后執行AJAX調用，然后再次執行AJAX代碼而不是代碼C。 在下一次迭代中，將再次執行AJAX代碼而不是代碼B。對我來說，執行順序如上表所示對我來說很重要。 如您所見，應該為每個循環重新初始化變量列表 ，但是，我們只有第一次初始化就進行了多次AJAX調用。

我該如何解決？

Answer 1

您需要像這樣使$ .ajax（）同步（而不是默認的異步）：

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

這將導致腳本的執行要等到$ .ajax完成后，才能繼續執行腳本的其余部分。

我希望這有幫助！

Answer 2

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();
    }
  });

}