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 锁定弹出层实现代码
Feb 23 Javascript
『jQuery』.html(),.text()和.val()的概述及使用
Apr 22 Javascript
IE6中链接A的href为javascript协议时不在当前页面跳转
Jun 05 Javascript
PHP实现的各种中文编码转换类分享
Jan 23 Javascript
JavaScript函数的调用以及参数传递
Oct 21 Javascript
浅谈js中function的参数默认值
Feb 20 Javascript
ReactNative实现Toast的示例
Dec 31 Javascript
解决bootstrap模态框数据缓存的问题方法
Aug 10 Javascript
vue-cli 3.x 配置Axios(proxyTable)跨域代理方法
Sep 19 Javascript
node命令行工具之实现项目工程自动初始化的标准流程
Aug 12 Javascript
js对象数组和对象的使用实例详解
Aug 27 Javascript
layerui代码控制tab选项卡,添加,关闭的实例
Sep 04 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
PHP使用数组实现队列
2012/02/05 PHP
通过php修改xml文档内容的方法
2015/01/23 PHP
PHP项目多语言配置平台实现过程解析
2020/05/18 PHP
web页面数据展示新想法(json)
2010/06/08 Javascript
基于JQuery的6个Tab选项卡插件
2010/09/03 Javascript
新发现一个骗链接的方法(js读取cookies)
2012/01/11 Javascript
JavaScript控制Session操作方法
2013/01/17 Javascript
jQuery动画效果-slideUp slideDown上下滑动示例代码
2013/08/28 Javascript
js设置cookie过期及清除浏览器对应名称的cookie
2013/10/24 Javascript
jQuery实现复选框成对选择及对应取消的方法
2015/03/03 Javascript
jQuery实现锚点scoll效果实例分析
2015/03/10 Javascript
jQuery实现时尚漂亮的弹出式对话框实例
2015/08/07 Javascript
解决angularjs WdatePicker ng-model的问题
2018/09/13 Javascript
vue瀑布流组件实现上拉加载更多
2020/03/10 Javascript
python实现倒计时的示例
2014/02/14 Python
Python实现递归遍历文件夹并删除文件
2016/04/18 Python
基于Python实现的微信好友数据分析
2018/02/26 Python
python+openCV调用摄像头拍摄和处理图片的实现
2019/08/06 Python
Python学习笔记之函数的定义和作用域实例详解
2019/08/13 Python
python脚本实现音频m4a格式转成MP3格式的实例代码
2019/10/09 Python
解决python中的幂函数、指数函数问题
2019/11/25 Python
python编程进阶之异常处理用法实例分析
2020/02/21 Python
用HTML5实现网站在windows8中贴靠的方法
2013/04/21 HTML / CSS
canvas进阶之贝塞尔公式推导与物体跟随复杂曲线的轨迹运动
2018/01/10 HTML / CSS
Street One瑞士:德国现代时装公司
2019/10/09 全球购物
美国眼镜网站:LensCrafters
2020/01/19 全球购物
Weblogic和WebSphere不同特点
2012/05/09 面试题
两年的个人工作自我评价
2014/01/10 职场文书
ktv总经理岗位职责
2014/02/17 职场文书
业务内勤岗位职责
2014/04/30 职场文书
小学教师师德师风自我评价
2015/03/04 职场文书
实施意见格式范本
2015/06/05 职场文书
幼儿园安全管理制度
2015/08/05 职场文书
养成教育主题班会
2015/08/13 职场文书
Nginx URL重写rewrite机制原理及使用实例
2021/04/01 Servers
python如何利用cv2.rectangle()绘制矩形框
2022/12/24 Python