按順序收集AJAX結果

Question

我有一個值數組（ myarray ），我想迭代並在每次迭代時運行一個AJAX請求。 我將每個ajax請求放在另一個數組（ requests ）中，這樣我就可以在所有AJAX請求完成時調用一個alert ：

像這樣：

var requests = [];
for (i = 0; i < myarray.length; ++i) {
    requests.push($.ajax({
        url: 'anotherurl?=' + myarray[i],
        dataType: "JSONP",
        success: function (data) {
          array_of_results.push(data);
        }
    }));
}
$.when.apply($, requests).done(function() {
    alert('complete');
});

所有結果都在array_of_results中收集。 但是由於AJAX請求需要不同的時間來完成，因此該數組不具有原始順序的結果。

有沒有辦法訂購這個陣列？

我希望我有道理。 我很欣賞這是非常復雜的。

Answer 1

你試過以下嗎？ 我認為這應該有效。 所有響應應按順序在when()的成功函數中可用。

var requests = [];
for (i = 0; i < myarray.length; ++i) {
    requests.push($.ajax({
        url: 'anotherurl?=' + myarray[i],
        dataType: "JSONP"
    }));
}
$.when.apply($, requests).done(function() {
    array_of_results = arguments;
    alert('complete');
});

Answer 2

而不是使用循環考慮使用遞歸。 這是一個完整的例子：

var myArray = [
    "somevalue",
    "some other value",
    "another value"
];
var i = myArray.length;
var responses = [];

function doRequests(){
    i--;
    $.ajax({
        url: "myurl.php",
        data: {paramname: myArray[i]}
    }).done(function(response){
        responses.push(response);
        if(i>0) doRequests();
        else{
            // all requests sent.. do stuff
            // responses array is in order
            console.log(responses);
            alert("all done!");
        }
    });
}

Answer 3

您可以將自定義屬性添加到$.ajax對象，設置為i var。

var requests = [];
for (i = 0; i < myarray.length; ++i) {
    requests.push($.ajax({
        url: 'anotherurl?=' + myarray[i],
        dataType: "JSONP",
        myCustomIndex: i,
        success: function (data) {
          array_of_results[this.myCustomIndex] = data;
        }
    }));
}
$.when.apply($, requests).done(function() {
    alert('complete');
});

JavaScript真的很有用，如果你將一個值歸入一個超出其邊界的數組（高於0），那么數組的大小將自動設置為正確的數量。

Answer 4

如何使用異步設置的jquery.ajax調用為false。 這樣，reaponse將按要求按順序排列......

Answer 5

基於@Christo的答案 - 使用數組映射函數

var array_of_results = [];
var requests = myarray.map(function(item, index) {
    return $.ajax({
        url: 'anotherurl?=' + item,
        dataType: "JSONP",
        success: function (data) {
            array_of_results[index] = data;
        }
    }
});

...