Ajax的同步与异步

  现在的前端开发绝大多是的时候需要用到ajax,而用ajax势必会用到同步与异步属性(async)。

  在jquery的ajax中如果我们希望实现同步或者异步我们可以直接设置async发生为真或假即可true false,下面是我实际开发中遇到的一个两个例子:

例1:

sReturnValue = "";
// send sjax
$.ajax({url: "/mobiles/" + sMobile + "/",type: "GET",dataType: "json",
}).done(function (res) {if(res.data.count !== 0){message.showError("手机号已注册,请重新输入")}else{message.showSuccess("手机号可以正常使用");sReturnValue = "success"}
}).fail(function () {message.showError("服务器超时,请重试!")
});
return sReturnValue;

例2:

sReturnValue = "";
// send sjax
$.ajax({url: "/mobiles/" + sMobile + "/",type: "GET",dataType: "json",async: false  //使用同步的方式,true为异步方式
}).done(function (res) {if(res.data.count !== 0){message.showError("手机号已注册,请重新输入")}else{message.showSuccess("手机号可以正常使用");sReturnValue = "success"}
}).fail(function () {message.showError("服务器超时,请重试!")
});
return sReturnValue;

  在这里,在网页同时通过ajax往后台发送数据时,例2会一直在done哪里等待后台返回数据,而例1在等待server端返回的这个过程中,前台会继续 执行ajax块后面的脚本,直到server端返回正确的结果才会去执行success,也就是说这时候执行的是两个线程,ajax块发出请求后一个线程 和ajax块后面的脚本(另一个线程)

例3

$.ajax({ type:"POST",url:"Venue.aspx?act=init",dataType:"html",success:function1(result){   //function1()f1();f2();}failure:function1(result) { alert('Failed');
})
function2();

  在上例中,当ajax块发出请求后,他将停留function1(),等待server端的返回,但同时(在这个等待过程中),前台会去执行function2(),也就是说,在这个时候出现两个线程,我们这里暂且说为function1() 和function2()。

  当把asyn设为false时,这时ajax的请求时同步的,也就是说,这个时候ajax块发出请求后,他会等待在function1()这个地方,不会去执行function2(),知道function1()部分执行完毕。
注意

  同步的意思是当JS代码加载到当前AJAX的时候会把页面里所有的代码停止加载,页面出去假死状态,当这个AJAX执行完毕后才会继续运行其他代码页面假死状态解除。

  而异步则这个AJAX代码运行中的时候其他代码一样可以运行。

  因此回到例1,如果我使用默认的异步,在ajax请求后台数据之后,并不会一直等待后台的数据返回,而是直接去执行主线程接下来的代码(return sReturnValue),而此时我刚好需要后台返回的数值作为我判断的条件,因此就会出现,无论我后台的返回数据是咋样的,通过这个ajax返回的数据就只是一个空。因此为了避免这样的错误,我们需要将异步设置为flase

ajax的同步与异步相关推荐

  1. ajax中async_小猿圈web前端之ajax的同步和异步有怎样的区别?

    对于ajax我们应该知道ajax是主要用来在前端页面中向服务器后端请求数据,ajax中根据async的值不同分为同步(async = false)和异步(async = true)两种执行方式,那么, ...

  2. jq ajax同步异步,详解JQuery中Ajax的同步与异步

    说到ajax同步与异步,可能很多同学对它都不是很了解,接下来我们就Ajax的同步与异步作个简单的介绍.同步:提交请求->等待服务器处理->处理完毕返回这个期间客户端浏览器不能干任何事.异步 ...

  3. 注意ajax的同步和异步请求

    2019独角兽企业重金招聘Python工程师标准>>> 默认 一般ajax 或者 ajax工具  都是 异步请求的. 但是 在开发中,使用了一个 开源的 前端ui里面自带的ajax工 ...

  4. ajax 的同步和异步

    http://www.10086bank.com/2013327171624481.html 大家先看一段简单的jquery ajax 返回值的js 代码  function getReturnAja ...

  5. php和ajax的同步和异步请求,ajax 同步请求和异步请求的差异分析_javascript技巧

    ajax同步和异步的差异, 先看2段代码: 代码一: Synchronize = function(url,param) { function createXhrObject() { var http ...

  6. 【ajax 】同步、异步交互流程的区别

    同步 当加载页面的时候,它会等待后台服务器响应,会打断用户的操作,电脑也会变白一会 异步 不打断用户操作,自行加载数据. 转载于:https://www.cnblogs.com/kevinmajest ...

  7. ajax同步,异步简单的介绍

    星期天一个人捣鼓个人网站的事情,read8686.com,如果哪位开发者又欢迎大家一起探讨,在文章的有我的微信 就是这样的一个注册的页面,其实我要实现的功能是什么啊,就是在用户注册的时候判断在数据库里 ...

  8. ajax请求设置同步,ajax 设置同步

    这个问题总是碰见,但是又总是记不住怎么拼写,这次直接写出来,长期保存. Ajax请求默认的都是异步的 如果想同步 async设置为false就可以(默认是true) 例如: $.ajax({ url: ...

  9. Ajax的优缺点以及异步和同步的区别

    一.背景 上午时候同事问我这两个问题,其实大家都知道ajax的优点是不刷新页面加载,用户体验好,缺点是不安全之类的.但是并不能用很专业的术语来表述这些问题.这里记录一下. 二.Ajax的工作原理 1. ...

最新文章

  1. 网站外部链接优化如何进一步提升?
  2. POJ1324贪吃蛇(状态压缩广搜)
  3. OpenCV ORB角点检测
  4. Jupiter黑客松——IPFS开发者大赛火热报名中!
  5. Linux下的MySQL安装及卸载
  6. c java学哪个好_c语言和java学哪个好
  7. 掌握Java的内存模型,你就是解决并发问题最靓的仔
  8. Spring Cloud 各个组件介绍
  9. python开发工具和框架安装器_Python基础框架和工具
  10. VSS无法访问的问题
  11. 有限域f9的特征是多少_密码学数学基本第十一讲有限域.ppt
  12. 迅雷上如何下载热映的电影大片~~
  13. wps使用切片器,解决切片器灰色问题
  14. Android 图片压缩的几种方法
  15. mfc程序退出时删除托盘图标
  16. java制作SM2证书
  17. 019基于脑电图信号和CNN的癫痫发作检测2018
  18. VUE事件参数$event
  19. C语言计算数字乘积根,c语言,求任意一个整数各位数字之积
  20. 华硕路由器固件 虚拟服务器,华硕路由器开启设置虚拟服务器

热门文章

  1. machine learning 四要素
  2. 使用iCheck插件,如何创建chenge事件
  3. 计算机网络 万维网的文档
  4. 阿里云 SLB示例配置
  5. Android开发必会技术!Flutter中网络图片加载和缓存源码分析,完整PDF
  6. RK3399 Android7.1修改系统默认USB功能
  7. 计算机算法常用术语中英对照
  8. 暑假积分不等式初探(未完)
  9. 特征工程之one-hot解读
  10. MPU6050加速度传感器学习笔记之实验《获取原始数据》