両方のAjaxリクエストが完了するまでどのように待つことができますか？

Question

は、ここに私のコードの簡略化である：

var res = array(); 

$.ajax({ 
    url: 'test1.php', 
    async: true, 
    success: function (data) { 
     res[1] = data.result; 
    } 
}); 

$.ajax({ 
    url: 'test2.php', 
    async: true, 
    success: function (data) { 
     res[2] = data.result; 
    } 
}); 

if (/* both ajax request are done */) { 
    // do stuff 
} else { 
    // wait 
} 

あなたは私が（並列）同時にでそれらのAJAXリクエストを実行するためにasync: trueを使用しました見ることができるように。今私は両方の要求が完了するまで待つ必要があります。どのようにしてAjaxリクエストが行われたのか確認できますか？それが完了するまで待たなければならない？

Answer 1

あなたが使用することができます約束：

Promise.all([ 
    $.ajax({ url: 'test1.php' }), 
    $.ajax({ url: 'test2.php' }) 
]) 
.then(([res1, res2]) => { 
    // Both requests resolved 
}) 
.catch(error => { 
    // Something went wrong 
}); 

Answer 2

使用Promise.all機能。約束のすべてをあなたにも、コールバック関数を使用することができ、それは最初の約束の故障値と

Promise.all([ 
    $.ajax({ url: 'test1.php'}), 
    $.ajax({ url: 'test2.php'}) 
]) 
.then(results => { 
    // results is an array which contains each promise's resolved value in the call 
}) 
.catch(error => { 
    // The value of the first rejected promise 
}); 

Answer 3

を拒否され解決され、それ以外の、then関数に配列としてデータを渡している場合、それは解決されます。

var res = []; 

function addResults(data) { 
    res.push(data); 
    console.log('Request # '+res.length); 
    if (res.length >= 2) { 
     // do stuff 
     console.log('both request has done.'); 
    } else { 
     // wait 
    } 
} 

$.ajax({ 
    url: 'https://jsonplaceholder.typicode.com/posts', 
    success: function (data) { 
     addResults(data); 
    } 
}); 

$.ajax({ 
    url: 'https://jsonplaceholder.typicode.com/posts', 
    success: function (data) { 
     addResults(data); 
    } 
}); 

Answer 4

この正式な文書はお役に立ちます。

http://api.jquery.com/ajaxStop/

は例：true`を：ところで

var res = []; 
$.ajax({ 
    url: 'test1.php', 
    async: true, 
    success: function (data) { 
     res.push('Ajax one is complete'); 
    } 
}); 

$.ajax({ 
    url: 'test2.php', 
    async: true, 
    success: function (data) { 
     res.push('Ajax two is complete'); 
    } 
}); 
var resALL = function(){ 
    console.log(this) 
} 
//After the requests all complete 
$(document).ajaxStop(resALL.bind(res))