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 相关文章推荐
用js实现的检测浏览器和系统的函数
Apr 09 Javascript
jQuery对表单的操作代码集合
Apr 06 Javascript
JavaScript 高级篇之函数 (四)
Apr 07 Javascript
获取下拉列表框的值是数组,split,$.inArray示例
Nov 13 Javascript
js实现的简单radio背景颜色选择器代码
Aug 18 Javascript
json+jQuery实现的无限级树形菜单效果代码
Aug 27 Javascript
jQuery轻松实现表格的隔行变色和点击行变色的实例代码
May 09 Javascript
用JS编写一个函数,返回数组中重复出现过的元素(实例)
Sep 14 Javascript
详解React服务端渲染从入门到精通
Mar 28 Javascript
vue 解决无法对未定义的值,空值或基元值设置反应属性报错问题
Jul 31 Javascript
Vue项目利用axios请求接口下载excel
Nov 17 Vue.js
JavaScript实现表单验证功能
Dec 09 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
Yii2.0预定义的别名功能小结
2016/07/04 PHP
php+ajax实现仿百度查询下拉内容功能示例
2017/10/20 PHP
js的写法基础分析
2011/01/17 Javascript
JavaScript中将一个值转换为字符串的方法分析[译]
2012/09/21 Javascript
JavaScript类属性的访问方式详解
2014/02/11 Javascript
angular简介和其特点介绍
2015/01/29 Javascript
jQuery Mobile动态刷新页面样式的实现方法
2016/05/28 Javascript
JavaScript中instanceof运算符的使用示例
2016/06/08 Javascript
js从外部获取图片的实现方法
2016/08/05 Javascript
AngularJS中$http服务常用的应用及参数
2016/08/22 Javascript
js中利用cookie实现记住密码功能
2020/08/20 Javascript
Vue中保存用户登录状态实例代码
2017/06/07 Javascript
JS+canvas绘制的动态机械表动画效果
2017/09/12 Javascript
vue+egg+jwt实现登录验证的示例代码
2019/05/18 Javascript
layui type2 通过url给iframe子页面传值的例子
2019/09/06 Javascript
Vue.js页面中有多个input搜索框如何实现防抖操作
2019/11/04 Javascript
jQuery 常用特效实例小结【显示与隐藏、淡入淡出、滑动、动画等】
2020/05/19 jQuery
Windows下Python2与Python3两个版本共存的方法详解
2017/02/12 Python
python实现扫描日志关键字的示例
2018/04/28 Python
Python设置在shell脚本中自动补全功能的方法
2018/06/25 Python
python 计算概率密度、累计分布、逆函数的例子
2020/02/25 Python
python3 sorted 如何实现自定义排序标准
2020/03/12 Python
使用Python3 poplib模块删除服务器多天前的邮件实现代码
2020/04/24 Python
python中pyqtgraph知识点总结
2021/01/26 Python
CSS Grid布局教程之浏览器开启CSS Grid Layout汇总
2014/12/30 HTML / CSS
html5之Canvas路径绘图、坐标变换应用实例
2012/12/26 HTML / CSS
Joules美国官网:出色的英国风格
2017/10/30 全球购物
TripAdvisor德国:全球领先的旅游网站
2017/12/07 全球购物
新秀丽官方旗舰店:Samsonite拉杆箱、双肩包、皮具
2018/03/05 全球购物
GAZMAN官网:澳大利亚领先的男装品牌
2019/12/19 全球购物
美食节策划方案
2014/05/26 职场文书
2014年采购员工作总结
2014/11/18 职场文书
大学生个人学习总结
2015/02/15 职场文书
酒店辞职信怎么写
2015/02/27 职场文书
2015年保洁工作总结范文
2015/04/28 职场文书
践行三严三实心得体会(2016推荐篇)
2016/01/06 职场文书