用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請求已完成。