jquery多个ajax检查所有完成？ （顺序不重要）

Is there a neat way to make sure a bunch of ajax callbacks have all finished? They don't need to be executed in order, i just need all the data to be there.

有一个简洁的方法来确保一堆ajax回调都完成了吗？它们不需要按顺序执行，我只需要所有数据。

one idea is to have them all increment a counter on completion and check if counter == countMax, but that seems ugly. Also, are there sync issues? (from simultaneous read/write to the counter)

一个想法是让它们在完成时都增加一个计数器并检查counter == countMax，但这看起来很难看。还有同步问题吗？ （从同时读/写到计数器）

4 个解决方案

#1

The .ajaxStop() method is available for this, it only fires when the last of the current ajax requests finishes. Here's the full description:

.ajaxStop（）方法可用于此，它仅在最后一个当前ajax请求完成时触发。这是完整的描述：

Whenever an Ajax request completes, jQuery checks whether there are any other outstanding Ajax requests. If none remain, jQuery triggers the ajaxStop event. Any and all handlers that have been registered with the .ajaxStop() method are executed at this time.

每当Ajax请求完成时，jQuery都会检查是否还有其他未完成的Ajax请求。如果没有，jQuery会触发ajaxStop事件。已经使用.ajaxStop（）方法注册的任何和所有处理程序都会在此时执行。

For example if you wanted to just run something, document is a good place to hook in:

例如，如果你想只运行一些东西，那么文档是一个很好的地方：

$(document).ajaxStop(function() {
  //all requests finished!, do something with all your new fancy data
});

Or you could display a message when this happens, like this:

或者你可以在发生这种情况时显示一条消息，如下所示：

$("#ajaxProgressDiv").ajaxStop(function() {
  //display for 2 seconds then fade out
  $(this).text("All done!").delay(2000).fadeOut();
});

#2

You may take a look at the queue plugin.

您可以查看队列插件。

#3

var msg= $("<div style='height:100px;width:200px; background:#000;color:#fff; line-height:100px;text-align:center;position:fixed;top:50%;left:50%;z-index:1000;margin-left:-100px; margin-top:-50px'>Ajax done! Click Me!</div>")
.click(function(){
$(msg).fadeOut(1000,function(){
   $(this).remove();
   });
})

$(document).ajaxStop(function(){
  $('body').append(msg);
})

the point is attaching ajaxStop() event to document for global check. you might be more specific if you want.

关键是将ajaxStop（）事件附加到文档以进行全局检查。如果你愿意，你可能会更具体。

#4

Also $.active will contain the current number of active AJAX requests, for anyone trying to use it with JSONP requests (like I was) you'll need enable it with this:

此外，$ .active将包含当前活动的AJAX请求数，对于任何试图将其与JSONP请求一起使用的人（就像我一样），你需要启用它：

jQuery.ajaxPrefilter(function( options ) {
    options.global = true;
});

Keep in mind that you'll need a timeout on your JSONP request to catch failures.

请记住，您需要在JSONP请求上超时以捕获故障。