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函数运行。