javascript - 如何在 jquery 中获取多个延迟调用的 ajax 结果？

Question

我正在尝试让 jquery 延迟工作，如下面的代码所示。

<script type="text/javascript">
    var appUrls = {
                      GetDataUrl : '@Url.Action("GetData")'
                  };

    function GetData1(){
        return $.getJSON(appUrls.GetDataUrl, { Id: 1 });
    }

    function GetData2() {
        return $.getJSON(appUrls.GetDataUrl, { Id: 2 });
    }

    $(function(){
        $("#result").html("Getting Data1, Data2 .... ");

        $.when(GetData1(), GetData2())
         .then(function(result){
             //The 'result' only contains the data from first request.  
             console.log(result);
             $("#result").html("Completed GetData1, GetData2"); 
         });

    });

    </script>

两个调用都完成后，我想提取两个调用返回的 Json 数据。但是，“结果”对象只包含第一次调用 (GetData1) 返回的数据？如何在上面的“then”回调方法中获得两个调用的结果。

Answer 1

由于您有两个请求，您将得到两个参数result1,result2：

<script type="text/javascript">
var appUrls = {
    GetDataUrl : '@Url.Action("GetData")'
};

function GetData1(){
    return $.getJSON(appUrls.GetDataUrl, { Id: 1 });
}

function GetData2() {
    return $.getJSON(appUrls.GetDataUrl, { Id: 2 });
}

$(function(){
    $("#result").html("Getting Data1, Data2 .... ");

    $.when(GetData1(), GetData2())
    .then(function(result1,result2){
        console.log(result1);
        console.log(result2);
        $("#result").html("Completed GetData1, GetData2"); 
    });

});

</script>