jquery ajax inside .each 如何在整个.each 完成时触发函数答案

【问题标题】：Jquery ajax inside .each How to trigger function when the whole .each is completejquery ajax inside .each 如何在整个.each 完成时触发函数
【发布时间】：2013-09-26 01:10:46
【问题描述】：

我有以下功能：

$.each(friends, function(friend, data) {
        var group = "Chat";

$.ajax({'type':'GET', 'url':'/site/getgroup?username=' + friend,
'success':function(callback){

group = callback;
self.addFriend(friend, data.status, group);

}, //ajax success
});  //ajax

            });

在这些代码之后，我有一些代码可以使用来自这些 .each 和 .ajax 的数据来初始化 chatBar。然而，现在由于 Ajax 是异步的，它变得非常有问题。我怎么知道这些 .each 都完成了返回的 ajax 值而不将 ajax async 设置为 false？（表示这部分已经完成）。

有没有一种方法可以让我使用 .promise、.complete 或 XHR 来了解整个 .each 事物是否完整？我尝试了很多东西，但它们似乎不适合我。

谢谢，

【问题讨论】：

我会以不同的方式解决这个问题，只发出一个 Ajax 请求并在回调中循环遍历结果。尽管该解决方案可能需要对 getgroup 进行一些重构。

标签： javascript jquery ajax asynchronous

【解决方案1】：

使用$.when()

var xhrs = []
$.each(friends, function (friend, data) {
    var group = "Chat";
    var xhr = $.ajax({
        'type': 'GET',
        'url': '/site/getgroup?username=' + friend,
        'success': function (callback) {
            group = callback;
            self.addFriend(friend, data.status, group);    
        }, //ajax success
    }); //ajax
    xhrs.push(xhr)
});

$.when.apply($, xhrs).done(function(){
    //all are complete
});

【讨论】：

【解决方案2】：

一个简单的解决方案是拥有一个状态数组，并且对于每个 ajax 请求，在成功/错误处理程序上更新并检查状态数组以查看所有其他 ajax 请求是否已完成。这样，您还可以存储每个 ajax 请求的响应。

【讨论】：

【解决方案3】：

看看$.when()，它看起来可能会解决您的问题。我不能确定它会对$.each 造成什么影响。

http://api.jquery.com/jQuery.when/

【讨论】：