多个ajax请求完成后触发回调答案

【问题标题】：Firing callback after multiple ajax requests are complete多个ajax请求完成后触发回调
【发布时间】：2012-04-09 23:37:33
【问题描述】：

loadInfo: function(){
    var jsonCounter = 0,
    room = ['room1','room2','room3'],
    dates = [],
    prices = []

    $.each(booking.rooms, function(key, room_name) {
        $.getJSON('/get_info.php?room='+room_name, function(data) {
            dates[room_name] = data
            jsonCounter++
        })
        $.getJSON('/get_info.php?room='+room_name+'&prices', function(data) {
            prices[room_name] = data
            jsonCounter++
        })

    })

    function checkIfReady() {
        if (jsonCounter === rooms.length * 2) {
            clearInterval(timer)
            run_the_rest_of_the_app()
        }
    }

    var timer = setInterval(checkIfReady, 100)

}

（修改了很多，因为它是类等的一部分）

目前这感觉有点骇人听闻，因为计时器的使用似乎很垃圾。我会使用 $.when 和 $.done，但我不知道可能有多少个房间，所以我不知道什么时候放什么。

如何确保仅在所有 AJAX 请求返回后才调用 run_the_rest_of_the_app()？

【问题讨论】：

标签： jquery ajax callback

【解决方案1】：

var activeAJAX = 0;
在进行 AJAX 调用之前，activeAJAX++;
完成 AJAX 调用后（在回调中）：if (--activeAJAX == 0) { allDone(); }

【讨论】：

【解决方案2】：

这里是如何使用when/done

loadInfo: function(){
    var room = ['room1','room2','room3'],
    dates = [],
    prices = [],
    requests = [];

    $.each(booking.rooms, function(key, room_name) {
        var aRequest;

        aRequest = $.getJSON('/get_info.php?room='+room_name, function(data) {
            dates[room_name] = data;
        });
        requests.push(aRequest);

        aRequest = $.getJSON('/get_info.php?room='+room_name+'&prices', function(data) {
            prices[room_name] = data;
        });
        requests.push(aRequest);

    })

    $.when.apply($, requests).done(run_the_rest_of_the_app);
}

【讨论】：

奇怪的是，这在我的测试中不起作用。 done 位在请求完成之前触发。奇数。
嗯.. 我想知道我们是否看到了单个 success 回调和组的 done 回调之间的竞争条件。请求真的没有完成吗？或者只是在执行done 回调时没有调用他们的回调？
我在 $.each 之前还有一个额外的，所以它可能是在第一个 $.getJSON 被触发之前完成的？诡异的。最后我还是使用了我的垃圾计时器版本，因为我想要一个状态栏，而且它很容易做到！