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 相关文章推荐
两个DIV等高的JS的实现代码
Dec 23 Javascript
asp.net下利用js实现返回上一页的实现方法小集
Nov 24 Javascript
动态加载script文件的两种方法
Aug 15 Javascript
使用GruntJS构建Web程序之构建篇
Jun 04 Javascript
jquery实现侧边弹出的垂直导航
Dec 09 Javascript
2014 年最热门的21款JavaScript框架推荐
Dec 25 Javascript
jQuery实现搜索页面关键字的功能
Feb 16 Javascript
JavaScript实现QQ列表展开收缩扩展功能
Oct 30 Javascript
基于jquery实现五星好评
Nov 18 jQuery
Angular-UI Bootstrap组件实现警报功能
Jul 16 Javascript
javascript设计模式 ? 建造者模式原理与应用实例分析
Apr 10 Javascript
js实现简单五子棋游戏
May 28 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
后宫无数却洁身自好的男主,唐三只爱小舞
2020/03/02 国漫
source.php查看源文件
2006/12/09 PHP
php长字符串定义方法
2012/07/12 PHP
php 如何获取文件的后缀名
2016/06/05 PHP
laravel5.1框架基础之Blade模板继承简单使用方法分析
2019/09/05 PHP
用js生产批量批处理执行命令
2008/07/28 Javascript
基于jquery的鼠标拖动效果代码
2012/05/30 Javascript
jQuery的控件及事件(输入控件及回车事件)使用示例
2013/07/25 Javascript
jquery实现省市select下拉框的替换(示例代码)
2014/02/22 Javascript
JavaScript中的6种运算符总结
2014/10/16 Javascript
JavaScript中使用Object.prototype.toString判断是否为数组
2015/04/01 Javascript
jQuery图片轮播(二)利用构造函数和原型创建对象以实现继承
2016/12/06 Javascript
JS设计模式之数据访问对象模式的实例讲解
2017/09/30 Javascript
vue-cli 使用axios的操作方法及整合axios的多种方法
2018/09/12 Javascript
基于Vue 服务端Cookies删除的问题
2018/09/21 Javascript
layer关闭当前窗口页面以及确认取消按钮的方法
2019/09/09 Javascript
python中执行shell命令的几个方法小结
2014/09/18 Python
python测试驱动开发实例
2014/10/08 Python
python matplotlib绘图,修改坐标轴刻度为文字的实例
2018/05/25 Python
python重试装饰器的简单实现方法
2019/01/31 Python
linux查找当前python解释器的位置方法
2019/02/20 Python
python适合人工智能的理由和优势
2019/06/28 Python
Python编程学习之如何判断3个数的大小
2019/08/07 Python
Python解释器以及PyCharm的安装教程图文详解
2020/02/26 Python
jupyter 实现notebook中显示完整的行和列
2020/04/09 Python
Python urllib2运行过程原理解析
2020/06/04 Python
W3C公布最新的HTML5标准草案
2008/10/17 HTML / CSS
html5 video全屏播放/自动播放的实现示例
2020/08/06 HTML / CSS
全球最大运动品牌的男装、女装和童装官方库存商:A&A Sports
2021/01/17 全球购物
楼面部长岗位职责范本
2014/02/14 职场文书
学生安全教育材料
2014/02/14 职场文书
关于安全的标语
2014/06/10 职场文书
乡镇党的群众路线教育实践活动总结报告
2014/10/30 职场文书
关于童年的读书笔记
2015/06/26 职场文书
2019年幼儿园管理条例范本!
2019/07/17 职场文书
SpringBoot实现异步事件驱动的方法
2021/06/28 Java/Android