为什么每当我将ajax放入for循环中时,它都无法很好地同步?
例如,我的代码是:
function addToUserGroupList() { _root.qDomId('js-assignGroupArrBtn').disabled = true for (var i = 0; i < selectedIds.length; i++) { $.ajax({ type: "POST", url: 'groupManage.ashx', dataType: 'text', data: 'type=getInfo&groupId=' + selectedIds[i], success: function (result) { if (result != '') { this.groupName = result.split('&')[0]; this.groupNotes = result.split('&')[2]; userGroupList.push({ 'uid': parseInt(selectedIds[i]), 'name': this.groupName, 'adminStr': this.groupNotes }); _root.userListObj.gourpInst.gourpTB(userGroupList); } }, error: function (XMLHttpRequest, status, errorThrown) { alert('failed to add to user\'s group.'); } }); } _root.qDomId('js-assignGroupArrBtn').disabled = false; selectedIds = []; }
为什么它先调用selectedIds = [];Ajax查询?是否有可能让ajax查询在继续之前完成selectedIds = [];?因为它在完成填充之前就清除了数组。:/
selectedIds = [];
首先,您确实需要了解Ajax调用是如何异步的(这就是Ajax中的“ A”所代表的意思)。这意味着调用$.ajax()仅启动ajax调用(它将请求发送到服务器),其余代码愉快地继续运行。有时,在其余代码执行完毕之后,当响应从服务器返回时,将调用成功或错误回调处理程序。这不是顺序编程,必须采用不同的方法。
$.ajax()
#1的意思是,在ajax调用之后,任何您想发生的事情都必须在成功或错误处理程序中或从那里进行。位于ajax调用之后的代码将在ajax调用完成之前运行很长时间。
因此,有多种方法来构造代码以与该异步概念一起使用。如果一次只需要一个异步ajax调用,则必须进行此重组,并且不能使用简单的for循环。相反,您可以创建一个索引变量,然后在完成函数中增加索引并开始下一次迭代。这是一种编码方式:
for
function addToUserGroupList() { _root.qDomId('js-assignGroupArrBtn').disabled = true var i = 0; function next() { if (i < selectIds.length) { $.ajax({ type: "POST", url: 'groupManage.ashx', dataType: 'text', data: 'type=getInfo&groupId=' + selectedIds[i], success: function (result) { i++; if (result != '') { this.groupName = result.split('&')[0]; this.groupNotes = result.split('&')[2]; userGroupList.push({ 'uid': parseInt(selectedIds[i]), 'name': this.groupName, 'adminStr': this.groupNotes }); _root.userListObj.gourpInst.gourpTB(userGroupList); } next(); }, error: function (XMLHttpRequest, status, errorThrown) { alert('failed to add to user\'s group.'); } }); } else { // last one done _root.qDomId('js-assignGroupArrBtn').disabled = false; selectedIds = []; } } // kick off the first one next(); }