用Javascript处理异步调用

Question

我在这里遇到了一些麻烦。在我的document.ready函数中，我定义了一个对象，并且该对象由三个不同的ajax调用（在document.ready中）填充。现在我想做一个

console.log(myObject); 

只有当3个异步调用已完全执行。请建议一种方法来做到这一点。

Answer 1

使用我建议你创建这样一个功能：

function onAllInformationIsReady() { 
     console.log(myObject); 
    } 

function isAllInformationReady() { 
    // verify here if you have all the information 
} 

，你做你的Ajax调用是这样的（我不是假设你在这里使用jQuery，请用你的Ajax调用法）

$.ajax({ 
    type: "POST", 
    url: "some.php", 
    data: "...n", 
    success: function(msg){ 

    if(isAllInformationReady()) 
     onAllInformationIsReady(); 

    } 
}); 

顺便说一句，如果你正在使用jQuery你可以同步Ajax调用是这样的：

$.ajax({ 
     type: "POST", 
     url: "some.php", 
     data: "...n", 
     async: false, 
     success: function(msg){ 

     } 
    }); 

Answer 2

尝试的jQuery 1.5的新的“deferred”的对象：

var j1 = $.ajax(...); 
var j2 = $.ajax(...); 
var j3 = $.ajax(...); 

j1.success(function(data) { 
    // do something with data 
}); 

j2.success(function(data) { 
    // do something with data 
}); 

j3.success(function(data) { 
    // do something with data 
}); 

$.when(j1, j2, j3).done(function() { 
    console.log(myObject); 
}); 

三个.success()功能将被异步调用，将填充myObject，然后done功能将只通过$.when()调用一次所有三个AJAX请求已完成。