javascript - 在 ajax 调用完成之前过早出现 jQuery.when() 语句

Question

尝试使用 jquery 和 ajax 更改最初在我的页面上打印的消息:

document.write('<p align="center" id="DataReady">Waiting for server to update the table</p>');

在完成所有 ajax 调用并更新我的数据后，再做其他事情。我的代码大纲如下:

function getData(m) {

    jqs[m] = $.ajax({
        url : WebURL[m],
        type : 'GET',
        dataType: 'jsonp',
        myJ : m
    });
    return jqs[m];
}


function handleData(json_data){

    var j = this.myJ;

    // Inside this function, I manipulate the json_data 
    // object and store it into other variables
}   

$(document).ready(function() { 

    for (var i=0; i<5; i++){
        getData(i).done(handleData); 
    }

    $.when(jqs).done(function(){
        document.getElementById("DataReady").innerHTML = "Up to date!"
    });
});

当文档准备好后，我基本上循环遍历我的 getData 函数并使用延迟对象执行 ajax 调用，当每个相应的 ajax 调用完成时，handleData 函数获取 json 数据(特定于每个相应的 ajax 调用)和操纵它以供进一步使用。

但是，一旦我遍历了所有的 ajax 调用(存储在 jqs 数组中)，我似乎无法使最后一部分正常工作:我的 $.when 语句。我已经查看了 jquery API ( http://api.jquery.com/jQuery.when/ )，但似乎看不出我做错了什么。

我希望在最后一条语句中发生的是当所有 ajax 调用完成时(存储在数组 jqs 中)，初始消息更改为“最新消息!”，但不会更早。现在看来，该消息正在更改为“最新!”即使 ajax 调用没有完成。更麻烦的是，如果我删除 getData(i).done(handleData); 行，即使没有发生 ajax 调用，消息仍然会发生变化。有谁知道如何解决这个问题？非常感谢任何建设性的帮助。谢谢。

Answer 1

$.when() 不接受数组。
当您传递一个数组(即使它是一个 promise 数组)时，jQuery 会将其视为已解析的值。

要传递多个 promise ，您需要调用 .apply 将每个 promise 作为单独的参数传递:

$.when.apply($, jqs).done(...);