AJAX:同步还是排队

Question

我正在使用AJAX调用开发一些Web服务。在我的网页上，用户必须选择一个或多个人才能加入一个群。这个"组列表"被发送到一个PHP页面(使用POST方法)，该页面将执行相关的WebServices。

我的问题是关于同步/异步AJAX调用。我的目标是在这个过程中显示一个动画(例如gif)，它会阻塞用户界面，并在最后显示消息"完成"。我使用了两个Jquery插件：Apprise用于消息，Jquery msg用于动画。

在同步模式下：不显示动画，但当AJAX调用完成时，会显示消息"完成"。在异步模式下：显示动画，但在AJAX调用结束之前显示消息"complete"。

所以我的问题是，我必须对多个异步AJAX调用进行排队吗？或者其他什么？

Answer 1

是的，这可能是因为同时有多个异步调用在运行。
我使用以下小脚本来控制当前运行的ajax调用数量：

$.xhrPool = { calls: [] };
$.xhrPool.abortAll = function () {
$(this.calls).each(function (idx, jqXHR) {
jqXHR.abort();
});
$.xhrPool.calls = [];
};

// Setup ajax requests
$.ajaxSetup({
beforeSend: function (jqXHR) {
$.xhrPool.calls.push(jqXHR);
},
complete: function (jqXHR) {
var isInArray = $.inArray(jqXHR, $.xhrPool.calls);
if (isInArray > -1) {
$.xhrPool.calls.splice(isInArray, 1);
}
}
});

通过这种方式，您将在数组$.xhrPool.calls中拥有所有当前活动的ajax请求。然后，您可以检查if ($.xhrPool.calls.length == 0)，如果是，则删除加载的动画。

此外，您可以调用$.xhrPool.abortAll()，它将停止所有活动的ajax请求。