博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
如何等待ajax完成再执行相应操作
阅读量:5788 次
发布时间:2019-06-18

本文共 1299 字,大约阅读时间需要 4 分钟。

ajax广泛应用于异步请求,对于大多数业务来说,这是十分方便的,但对于一些特殊的业务,ajax的异步性会起到相反的作用。

例如在ajax请求成功后,后续的操作需要依赖ajax执行成功后的相应操作。

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

// 声明一个表示状态的全局变量 statusvar status = false;// ajax$.ajax({    url:"/checkUsername",    type:"post",    // ajax 同步执行    async:false,    success:function(){        status = true;  }  });// 根据 status 的状态 进行后续操作function(){  if(status){    // 后续操作}  }

但是这种方式在有些情况下并不好用。推荐第二种方式。

2、利用 jquery 的 when().done 函数 等待 ajax 执行结束之后再进行后续操作。

// 声明一个表示状态的全局变量 statusvar status = false;// ajaxmyajax = $.ajax({    url:"/checkUsername",    type:"post",    success:function(){        status = true;  }  });// 根据 status 的状态 进行后续操作function(){  // myajax 请求完毕时执行  $.when(myajax).done(function(){      if(status){        // 后续操作      }      }) ;}

此时的 status 是在 ajax 执行完成后被重新赋值后的 status ,值为 true。

转载于:https://www.cnblogs.com/elementplay/p/10789600.html

你可能感兴趣的文章
poj 1183
查看>>
从根本解决跨域(nginx部署解决方案)
查看>>
javascript实现的一个信息提示的小功能/
查看>>
Centos7.x:开机启动服务的配置和管理
查看>>
HTML5 浏览器返回按钮/手机返回按钮事件监听
查看>>
xss
查看>>
iOS:百度长语音识别具体的封装:识别、播放、进度刷新
查看>>
JS获取服务器时间并且计算距离当前指定时间差的函数
查看>>
华为硬件工程师笔试题
查看>>
jquery居中窗口-页面加载直接居中
查看>>
cd及目录快速切换
查看>>
Unity Shaders and Effects Cookbook (3-5) 金属软高光
查看>>
31-hadoop-hbase-mapreduce操作hbase
查看>>
C++ 代码风格准则:POD
查看>>
linux-友好显示文件大小
查看>>
【转】【WPF】WPF中MeasureOverride ArrangeOverride 的理解
查看>>
【转】二叉树的非递归遍历
查看>>
NYOJ283对称排序
查看>>
接连遇到大牛
查看>>
[Cocos2d-x For WP8]矩形碰撞检测
查看>>