如何等待ajax完成再執行相應操作

ajax廣泛應用於異步請求，對於大多數業務來說，這是十分方便的，但對於一些特殊的業務，ajax的異步性會起到相反的作用。

例如在ajax請求成功后，后續的操作需要依賴ajax執行成功后的相應操作。

// 聲明一個表示狀態的全局變量 status
var status = false;
// ajax
$.ajax({
    url:"/checkUsername",
    type:"post",
    success:function(){
        status = true;  
}  
});

// 根據 status 的狀態 進行后續操作
function(){
  if(status){
    // 后續操作
}  
}

以上代碼對於不是很清楚ajax運行原理的朋友來說，看似沒什么毛病，但其實 status 的值在ajax 請求成功之后進行 if 判斷的時候值仍然為 false。

因為 ajax 有個 async 屬性，該屬性默認為 true，表示 ajax 異步執行，而在進行 if 判斷的時候，ajax 的異步執行還沒完成，因此 status 的值仍然是 false。

若要保證 status 的值是在 ajax 執行完成之后的最終值，有兩種辦法：

1、將 ajax 的 async 屬性設置為 false，表示 ajax 同步執行。

// 聲明一個表示狀態的全局變量 status
var status = false;
// ajax
$.ajax({
    url:"/checkUsername",
    type:"post",
    // ajax 同步執行
    async:false,
    success:function(){
        status = true;  
}  
});

// 根據 status 的狀態 進行后續操作
function(){
  if(status){
    // 后續操作
}  
}

但是這種方式在有些情況下並不好用。推薦第二種方式。

2、利用 jquery 的 when().done 函數 等待 ajax 執行結束之后再進行后續操作。

// 聲明一個表示狀態的全局變量 status
var status = false;
// ajax
myajax = $.ajax({
    url:"/checkUsername",
    type:"post",
    success:function(){
        status = true;  
}  
});

// 根據 status 的狀態 進行后續操作
function(){
  // myajax 請求完畢時執行
  $.when(myajax).done(function(){
      if(status){
        // 后續操作
      }  
    }) ;
}

此時的 status 是在 ajax 執行完成后被重新賦值后的 status ，值為 true。