jQuery-Ajax执行完后再执行其他操作

xyc

       通常使用Ajax的时候，往往都是因为执行先后的问题所烦恼，今天就说下Ajax执行完后在执行其他操作的方法。

       1.运用Ajax的 async 属性设置为 false，将 ajax 同步执行。
        

[JavaScript] 纯文本查看 复制代码

// 声明一个表示状态的全局变量 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 执行结束之后再进行后续操作。
      

[JavaScript] 纯文本查看 复制代码

// 声明一个表示状态的全局变量 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。

    推荐使用第二种方法。希望可以帮助到大家！

范范

支持下