$.when() 多个异步请求成功后再执行后续方法

$.when( $.ajax( "/page1.php" ), $.ajax( "/page2.php" ) )

.done(

function( a1, a2 ) {

var data = a1[ 0 ] + a2[ 0 ]; // a1[ 0 ] = "Whip", a2[ 0 ] = " It"

if ( /Whip It/.test( data ) ) { alert( "We got what we came for!" );}

}

);

a1是第一个异步返回的数据

a2是第二个异步返回的数据

在使用jquery调用Ajax函数时,往往会出现嵌套现象,这样代码写起来很混乱,比如以下情况:

$.ajax({
        url: "/home/GetProduct",
        dataType: "JSON",
        type: "GET",
        success: function (data) {
            $.ajax({
                url: "/home/GetProduct",
                dataType: "JSON",
                type: "GET",
                success: function (data) {
                    $.ajax({
                        url: "/home/GetProduct",
                        dataType: "JSON",
                        type: "GET",
                        success: function (data) {
        
                        }
                }
        }

非常难以看清逻辑,它的功能是外层代码执行完毕后在执行内部代码.

如果使用$.when,$.done后,看起来就非常简洁了

$.when($.ajax({
        url: "/home/GetProduct",
        dataType: "JSON",
        type: "GET",
        success: function (data) {
            alert(JSON.stringify(data));
        }
    })).done(function (data) {
        alert(data[0].Name);
    }).done(function (data) {
        alert(data[1].Name);
    }).fail(function () {
        alert("程序出现错误！");
    }).then(function (data) {
        alert("程序执行完成");
    });