jQuery：在每個項目中成功執行jQuery ajax調用的次數.each（）

Question

我需要計算jQuery ajax調用在列表中的每個項目上成功執行的次數。

我從這裏開始，但隨後意識到了這一點並不會因爲AJAX的「異步」部分的工作：

var numSuccessfullUpdates = 0; 

$('#saveMyListItems').click(function (event) { 
    event.preventDefault(); 

    $('ul#myList li').each(function() { 
     $.ajax({ 
      url: '[my_url]', 
      type: "POST", 
      data: { 
       // [data block here, not relevant to question] 
      }, 
      success: function() { 
       numSuccessfullUpdates++; 
      } 
     }); 
    }); 
    if (successfullUpdates > 0){ 
     alert(numSuccessfullUpdates); 
    } 
}); 

有什麼建議？

Answer 1

您可以使用complete AJAX處理程序並統計狀態結果，直到結果總數等於請求總數。以下是示例代碼，also available as a jsFiddle

$('#saveMyListItems').click(function (event) { 
    event.preventDefault(); 

    var ajaxCounter = { 
     goal: $('ul#myList li').length, 
     total: 0, 
     success: 0, 
     notmodified: 0, 
     error: 0, 
     timeout: 0, 
     abort: 0, 
     parsererror: 0 
    } 

    $('ul#myList li').each(function() { 
     $.ajax({ 
      url: '/echo/html', 
      type: "POST", 
      timeout: 1500, 
      data: { 
       html: "foobar", 
       delay: Math.floor(Math.random() * 5) 
      }, 
      complete: function (jqXHR, textStatus) { 
       ajaxCounter.total++ 
       ajaxCounter[textStatus]++; 
       if (ajaxCounter.total >= ajaxCounter.goal) { 
        alert(ajaxCounter.success + ' out of ' + ajaxCounter.total); 
       } 
      }, 
     }); 
    }); 
}); 

Answer 2

您還需要計算所有響應，並在達到總數或合理超時已過期時發出警報。

Answer 3

您可以嘗試在jQuery的1.5 +提供的新when()和then()功能，

$.when($.ajax("/page1.php"), $.ajax("/page2.php")).then(myFunc, myFailure); 

這裏執行的函數myFunc的當兩個Ajax請求是成功的，或者myFailure如果任何一個有錯誤。

因此，通過上述函數，您可以檢查是否所有的ajax請求都成功完成，如果myFunc函數運行。