我遇到有关在for循环中执行ajax请求的问题。我已经在网上搜索了它,并找到了一些我已经实现的解决方案,以避免同步运行请求。不幸的是,这些解决方案不提供如何确保成功块以正确顺序调用的信息。
这是我的代码:
for (var i = 0; i < array.length; i++) {
(function(index) {
var path = array[index].split(";")[1];
var selectedRevision = array[index].split(";")[0];
$.ajax({
url: 'svntojson.jsp?revHistoryForPath=' + path,
dataType:'text',
success:function(data){
console.log(index);
var $li = $("<li/>").text(path).addClass("ui-corner-all")
.prepend("<div class='handle'><span class='ui-icon ui-icon-carat-2-n-s'></span></div>")
.append('<button class="delete"></button>')
.append('<select class="revHistoryOptions" style="float:right;margin-right:5px;">' + data.trim() + '</select>');
$("#list").append($li);
$("#list").sortable('refresh');
$('.revHistoryOptions').eq(index).children('option[value=' + selectedRevision + ']').attr('selected', 'selected');
}
});
})(i);
}
然而索引的顺序可能会改变,因为一个ajax请求更早成功。这不是问题,但我在成功块中附加了一些列表元素,我需要确切的顺序。
所以我的问题是如何确保我的ajax请求的成功块将按照从0到n-1的for循环索引的顺序被调用。
答案 0 :(得分:3)
错误设计:如果您想要完整的同步行为并且不涉及迭代之间的任何用户交互,则可以避免 循环并使用单个ajax请求。
当您希望它完全同步时,您可以使用单个ajax:
$.ajax({
url: 'svntojson.jsp?inputArray=' + array,
dataType: 'json',//Note I changed this to json to receive the array on outputs
success: function (data) {
var resArray = data;
for (var index = 0; index < resArray.length; index++) {
var res = resArray[index];
var $li = $("<li/>").text(res.path).addClass("ui-corner-all")
.prepend("<div class='handle'><span class='ui-icon ui-icon-carat-2-n-s'></span></div>")
.append('<button class="delete"></button>')
.append('<select class="revHistoryOptions" style="float:right;margin-right:5px;">' + res.data + '</select>');
$("#list").append($li);
$("#list").sortable('refresh');
$('.revHistoryOptions').eq(index).children('option[value=' + res.selectedRevision + ']').attr('selected', 'selected');
}
}
});
在服务器上:
处理输入数组并为数组的每个元素生成输出。 (Psuedocode如下):
var resArray = new Array(inputArr.length);
for (var i = 0; i < inputArr.length; i++) {
var res = new res();
res.path = inputArr[i].split(";")[1];
res.selectedRevision = inputArr[i].split(";")[0];
resArray.push(res);
}
return resArray;