jQuery中的ajax async同步和异步详解


Posted in Javascript onSeptember 29, 2015

项目中有这样一个需求,使用ajax加载数据返回页面并赋值,然后前端取出该值

这其中涉及到代码的顺序问题,有时后台还未返回数据,但已执行后面代码,

所以就会造成取不到值

$.ajax({ type: "post",  url: "admin/PfmOptionRuleItem.do", success: function(data){  $("#ruleItem").val(data.ruleItem); //① } }); return $("#ruleItem").val(); //②

如果①还未从后台返回数据 此时执行②就获取不到值

Ajax的第一个字母是asynchronous的开头字母,这意味着所有的操作都是并行的,完成的顺序没有前后关系。

$.ajax()的async参数总是设置成true,这标志着在请求开始后,其他代码依然能够执行。

如果把这个选项设置成false,这意味着所有的请求都不再是异步的了,这也会导致浏览器被锁死。

虽然官方不建议这么干,只是不能用太多,否则会造成用户体验不佳

举个栗子

alert("setp 1"); $.ajax({  url: "admin/PfmOptionRuleItem.do",  async: false,  success: function(data){   alert("hello ajax"); //①  } }); alert("setp 2"); //②

当把asyn设为false时,这时ajax的请求时同步的,也就是说,这个时候ajax块发出请求后,

他会等待在①这个地方,不会去向下执行②,直到①执行完毕

此时依次执行顺序为

setp 1

hello ajax

setp 2

如果async为true 则执行顺序为

setp 1

setp 2

hello ajax

关于本文给大家叙述的jQuery中的ajax async同步和异步,全部介绍完了,希望对大家有所帮助。

Javascript 相关文章推荐
JQuery 获取和设置Select选项的代码
Feb 07 Javascript
动态加载外部javascript文件的函数代码分享
Jul 28 Javascript
关于jQuery的inArray 方法介绍
Oct 08 Javascript
jQuery在ul中显示某个li索引号的方法
Mar 17 Javascript
详解JavaScript中getFullYear()方法的使用
Jun 10 Javascript
jQuery实现获取绑定自定义事件元素的方法
Dec 02 Javascript
JS正则表达式之非捕获分组用法实例分析
Dec 28 Javascript
jquery 实现拖动文件上传加载进度条功能
Mar 18 jQuery
js拖动滑块和点击水波纹效果实例代码
Oct 16 Javascript
JavaScript常见鼠标事件与用法分析
Jan 03 Javascript
在layui中对table中的数据进行判断(0、1)转换为提示信息的方法
Sep 28 Javascript
JavaScript写个贪吃蛇小游戏(超详细)
Mar 17 Javascript
网页从弹窗页面单选框传值至父页面代码分享
Sep 29 #Javascript
pace.js页面加载进度条插件
Sep 29 #Javascript
js强制把网址设为默认首页
Sep 29 #Javascript
jQuery EasyUI Dialog拖不下来如何解决
Sep 28 #Javascript
JQuery实现左右滚动菜单特效
Sep 28 #Javascript
JS动态日期时间的获取方法
Sep 28 #Javascript
js电话号码验证方法
Sep 28 #Javascript
You might like
文件上传之SWFUpload插件(代码)
2015/07/30 PHP
php生成图片验证码的实例讲解
2015/08/03 PHP
PHP的openssl加密扩展使用小结(推荐)
2016/07/18 PHP
php获取linux命令结果的实例
2017/03/13 PHP
thinkPHP+phpexcel实现excel报表输出功能示例
2017/06/06 PHP
PHP的curl函数的用法总结
2019/02/14 PHP
URI、URL和URN之间的区别与联系
2006/12/20 Javascript
Web前端设计模式  制作漂亮的弹出层
2010/10/29 Javascript
基于jquery的$.ajax async使用
2011/10/19 Javascript
jQuery插件实现表格隔行换色且感应鼠标高亮行变色
2013/09/22 Javascript
JavaScript获取flash对象与网上的有所不同
2014/04/21 Javascript
js 实现数值的千分位及保存小数方法(推荐)
2016/08/01 Javascript
Node.js Sequelize如何实现数据库的读写分离
2016/10/23 Javascript
AngularJS入门示例之Hello World详解
2017/01/04 Javascript
Angular2 PrimeNG分页模块学习
2017/01/14 Javascript
浅析node应用的timing-attack安全漏洞
2018/02/28 Javascript
利用React Router4实现的服务端直出渲染(SSR)
2019/01/07 Javascript
详解package.json版本号规则
2019/08/01 Javascript
JS script脚本中async和defer区别详解
2020/06/24 Javascript
vue 接口请求地址前缀本地开发和线上开发设置方式
2020/08/13 Javascript
详解Python中类的定义与使用
2017/04/11 Python
Pandas之DataFrame对象的列和索引之间的转化
2019/06/25 Python
django中间键重定向实例方法
2019/11/10 Python
tensorflow模型的save与restore,及checkpoint中读取变量方式
2020/05/26 Python
error和exception有什么区别
2012/10/02 面试题
北京-环亚运商测试题.net程序员初步测试题
2013/05/28 面试题
献爱心活动总结
2014/05/07 职场文书
物业管理专业自荐信
2014/07/01 职场文书
幼儿园户外活动总结
2014/07/04 职场文书
2014年检验员工作总结
2014/11/19 职场文书
打架检讨书范文
2015/01/27 职场文书
《观察物体》教学反思
2016/02/17 职场文书
2019学校运动会开幕词
2019/05/13 职场文书
golang正则之命名分组方式
2021/04/25 Golang
springboot新建项目pom.xml文件第一行报错的解决
2022/01/18 Java/Android
详解Flutter和Dart取消Future的三种方法
2022/04/07 Java/Android