Question

我正在尝试从API Async加载一堆数据，当加载所有数据时，我想触发一个加载了所有数据的事件。我遇到的问题是我使用的API将响应对象的数量限制为五个。我可能需要检索30-40个响应对象。

所以我想要做的是创建一个when - then语句循环通过数据项并对每五个项目发出请求，然后当所有项目都被加载时我想触发一个加载的事件。我遇到的问题是when-then语句在ajax请求成功之前完成。

到我试过的代码上。

 function loadsLotsOfStats(stats, dataType, eventName, dataName, callback) {
     var groupedStats = [];
     while (stats.length > 0) {
         groupedStats.push(stats.splice(0, 5).join('/'));
     }
    j$.when(
        groupedStats.forEach(function (d) {
            loadJSONToData(model.apiUrl.replace("{IDS}", d), "json", "", dataName, function (d) { /*console.log(d);*/ }, true)
        })
    ).then(function () {
        j$(eventSource).trigger('dataLoaded', eventName);
    });

loadJSONToData函数基本上只是Async $ .ajax的包装函数。

所以是的，事件是在实际加载数据之前触发的。也是出于某些原因，如果我尝试在when中设置循环（通过语法错误声明它？

有没有人对如何制作一堆Ajax请求有任何建议，并等到所有人都在触发事件之前完成竞争？或者去解决我目前的问题？

提前感谢您的帮助。

Answer 1

你可以做你想要的事情。但是，您发送请求的服务器可能有理由限制它们执行。作为一名从事Web开发工作的人，亲眼目睹了DDOS，诈骗和其他滥用API的烦恼，我建议遵守他们的限制。

话虽如此，这就是你如何做到的。

$ .ajax实际上返回一个延迟对象，因此您可以利用它来获得优势。 $ .when也可以接受任意数量的延迟对象。结合这两个事实可以解决您的问题。

var deferreds = [];
$.each(groupedStats, function(index, stat){
    deferreds.push(
        // No success handler - don't want to trigger the deferred object
        $.ajax({
            url: '/some/url',
            data: {stat: stat},
            type: 'POST'
        })
    );
});
// Can't pass a literal array, so use apply.
$.when.apply($, deferreds).then(function(){
    // Do your success stuff
}).fail(function(){
    // Probably want to catch failure
}).always(function(){
    // Or use always if you want to do the same thing
    // whether the call succeeds or fails
});

请注意，这不是竞争条件。虽然$ .ajax是异步的，但$ .each不是，所以你的延迟列表将是你到达$ .when和$ .then / $之前的总列表.wone / $。只有在它们全部完成后才会触发

编辑：我忘了将分裂加5s，但这说明了一般的想法。你可以从这里弄清楚如何将它应用到你的问题中。顺便说一下，您可以使用array.splice（0,5）从数组中获取接下来的5个结果。 .splice使用安全;如果元素总数小于5，则只占用所有剩余元素。

Answer 2

您可以使用Async.js libray。并尝试each功能。

如何在JQuery When - Then语句中循环Ajax请求？

2 个答案: