javascript - 使用 jQuery.each 获取多个 ajax，当 (jQuery.when) 全部完成时执行某些操作

Question

我希望有一个函数，它接受 url 数组作为参数，然后异步下载每个 url 的 json，并在所有完成后执行一些函数。

首先，我有一个函数，它返回 ajax 以获取一个 url(延迟/ promise 对象)。

function get_json(url) {
    /* Asynchronously download data of type json */
    return $.ajax({url: url,
                   dataType: 'json'});
}

做好以下工作:

var url = 'http://data.hisparc.nl/api/station/501/';
get_json(url).done(function(data){console.log(data)});

所以，现在我希望能够给出一个 url 数组，然后能够附加一个完成以在完成时执行某些操作。我想出了这个:

function get_multiple_json(urls) {
    /* Asynchronously download multiple urls of type json */
    return $.when($.each(urls, function(i, url) {return get_json(url);}));
}

所以我认为这有效:

var urls = ['http://data.hisparc.nl/api/station/501/',
            'http://data.hisparc.nl/api/station/505/'];
get_multiple_json(urls).done(function() {alert('hi')});

但是在ajax完成之前就抛出了警报，看来$.each没有返回延迟对象。

那么我应该怎么做呢？

Answer 1

使用$.map而不是$.each :

var urls = ['http://data.hisparc.nl/api/station/501/',
            'http://data.hisparc.nl/api/station/505/'];

$.when.apply(null, urls.map(function (url) {
    return $.ajax({ url: url, dataType: 'json' });
})).then(function () {
   alert("hi");
});