JS中AJAX執行順序解決問題詳情（附解決方法）

這篇文章主要的解釋了關於js中ajax執行順序解決的問題，現在讓我們來看看這篇關於ajax的執行順序解決的文章吧

在JS中我們會遇到執行順序的問題，尤其是AJAX的執行順序，js中預設的執行順序是從上往下執行。

看下面的一段程式碼

    callback:function(value, validator, $field){
		$.ajax({
		  url : window.ctx+"/sys/manager/validateLoginName",
		  data:{loginName:value},
		  type : 'post',
		  dataType : "json",
		  async:true,  
		  success: function(result){
		  if(result!=null)
		  globalVariable.flag=result;
		  alert(1)
		       }});
		  alert(2)
		  if(globalVariable.flag!=1)return true;
		  if(globalVariable.flag==1)return false;	
  }

由於這裡的AJAX是非同步請求，所以在瀏覽器中會先彈出2在彈出1

這樣就會出現問題  假如flag預設是0，執行完AJAX之後會變成1,那麼if語句其實是用0去做的判斷，與我們的目的不相符，我們想要的是用AJAX執行完之後賦值的flag去做if判斷（想看更多就到PHP中文網AJAX開發手冊欄位學習）

#解決：

第一種方法

之所以會出現這樣的問題是因為AJAX採用了非同步請求，所以如果我們想先彈出1再彈出2只需要把AJAX改為同步即可，也就是將async改為false

這樣如果AJAX沒有執行完頁面會出現假死狀態，停止往下執行，只有當AJAX回調走完以後才會往下走

當然我們使用AJAX就是為了異步，所以上面的方法是遇到特殊的需要了可以這樣處理

第二種方法

第二種方法是比較常用的

例如下面一段程式碼

function test(){
	$.ajax({
		  url : window.ctx+"/sys/manager/addUserRole",
		  data:formData,
		  type : 'post',
		  dataType : "json",
	          processData:false,
	          contentType:false,
		  success: function(result){
			  if(result!=null){
				  testCallback();
			  }
		}});
         test2();
 }
function testCallback(){
	alert(1)
}
function test2(){
	alert(2)
}

AJAX是異步的，我們希望先彈出1再彈出2我們只需要把test2放在test的回呼函數中即可

像這樣

function test(){
	$.ajax({
		  url : window.ctx+"/sys/manager/addUserRole",
		  data:formData,
		  type : 'post',
		  dataType : "json",
	      processData:false,
	      contentType:false,
		  success: function(result){
			  if(result!=null){
				  testCallback();
			  }
		}});
}
function testCallback(){
	alert(1)
	test2()
}
function test2(){
	alert(2)
}

這篇文章到這就結束了（想看更多就到PHP中文網AJAX使用手冊欄位中學習），有問題的可以在下方留言提問。

以上是JS中AJAX執行順序解決問題詳情（附解決方法）的詳細內容。更多資訊請關注PHP中文網其他相關文章！