Question

假设我有以下javascript：

(function($) {
  $.getJSON(url, function(data) {
    $.each(data.rows, function(index, row) {
      $.getJSON(url2, function(data2) {
        //Do something with data2, like adding it to an element on the page.
        //When all rows have been processed, by this function, I want to
        //call a function.
      }
    }
  }
})(jQuery)

我希望在返回所有内部$ .getJSON时收到通知。

在我的真实代码中，我将使用一个回调函数，我希望在完成所有请求后调用它。

Answer 1

您可以使用jQuery.when()，例如：

(function($) {
  $.getJSON(url, function(data) {

    $.when.apply($, $(data.rows).map(function (idx, row) {
      // return deferred object
      return $.getJSON(url, function () {
        // single callback
        console.log('one done');
      });
    }))
    .then(function () {
      // success callback
      console.log('success');
    }, function () {
      // failure callback
      console.log('failure');
    });
  });
})(jQuery)

编辑：刚才意识到when不会将数组作为参数，所以我改为使用.apply代码。

Answer 2

您知道有多少第二个getJSON正在执行，因为它基于您从第一个获得的数据的大小。因此，请跟踪第二个getJSON执行的次数，以及当它与原始数据的大小匹配时，您就完成了。

(function($) {
  $.getJSON(url, function(data) {
    var count = 0;
    $.each(data.rows, function(index, row) {
      $.getJSON(url2, function(data2) {
         count++;
         if(count === data.rows.length){
             console.log('all done!');
         } 
      }
    }
  }
})(jQuery)

Answer 3

我相信您正在寻找jQuery的when和then功能。

使用示例：

var firstGet = $.getJSON(...),
    secondGet = $.getJSON(...);

$.when(firstGet(), secondGet())
.then(
    function (data1, data2) { alert('success!'); },
    function () { alert('fail'); }
);

Answer 4

两个答案都很好。我只是注意到这种模式并不是那么好，因为让我们想象你的第一个调用（$.getJSON(url)）返回50个元素（不是那么大），然后你会做出 50个AJAX请求同时，这是非常高的！它可能会降低浏览器的速度并为服务器创建开销。也许，第一次通话可以返回您需要的所有数据？然后您的问题就解决了，您的服务器是安全的，您的用户也最开心。

如何在调用$ .getJSON all的$ .getJSON完成时收到通知

4 个答案: