我的 AJAX 调用是在 for 循环内构建的。它们需要有序(同步)。我如何使用 jQuery 链接它们?
var array = ['One', 'Two', 'Three'];
var arrayLength = array.length;
for (var arrayCounter = 0; arrayCounter < arrayLength; arrayCounter++) {
var id = array[arrayCounter];
getData(id);
function getData(id) {
$.ajax({
url: 'http://example.com/' + id,
dataType: 'jsonp',
success: function(d) {
var response = d;
console.log(d);
},
error: function() {
alert("ERROR");
}
});
}
}
最佳答案
使用for
的解决方案:
var array = ['One', 'Two', 'Three'];
var id = array[0];
var data = getData(id);
for (var i = 1; i < array.length; i++) {
// Or only the last "i" will be used
(function (i) {
data = data.then(function() {
return getData(array[i]);
});
}(i));
}
// Also, see how better the getData can be.
function getData(id) {
return $.ajax({
url: 'http://example.com/' + id,
dataType: 'jsonp',
}).done(function(d) {
var response = d;
console.log(d);
}).fail(function() {
alert('ERROR');
});
}
顺便说一下,如果你使用了合适的 promises 库,比如 bluebird ,您将使用以下代码:
var array = ['One', 'Two', 'Three'];
Promise.reduce(array, function(data, id) {
return data.promise.then(function(result) {
return { promise: getData(id), results: data.results.push(result) };
});
}, []).then(function(data) {
console.log(data.results); // yay!
});
function getData(id) {
return Promise.cast($.ajax({
url: 'http://example.com/' + id,
dataType: 'jsonp',
}).done(function(d) {
var response = d;
console.log(d);
}).fail(function() {
alert('ERROR');
}));
}
如您所见,读/写更容易。
关于javascript - 使用 jQuery 的动态 AJAX promise 链,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/22736281/