jquery ajax属性async(同步异步)示例


Posted in Javascript onNovember 05, 2013

例1、jquery+ajax/" target="_blank">jquery ajax同步方式

$.ajax({
url : 'test.php',
type : 'post',
async: false,//使用同步的方式,true为异步方式
data : {'act':'addvideo', 'videoname':videoname},//这里使用json对象
success : function(data){
//code here...
},
fail:function(){
//code here...
}
});

例2
//javascript
function test()
{
 var a= 1;
 $.ajax({
  type   : 'GET',
  url    : 'test.php',
  data   : 'page=112',
  success:function(msg)
  {
   alert(msg);
   a= msg;
  }
 })
 alert(a);
}
//test.php
sleef('5'); //休息五分钟
echo 'in';
/*
 这个程序运行情况是  先打印1(a=1) 然后五秒过后 打印 in
 根据这个情况就可以知道 jquery 的ajax的执行流程 
 因为是异步调用
 以前就是这样给一个变量赋值  不管怎么弄都是不对的。最后就发现这个问题
 参数async改为false就为同步调用 当ajax返回结果后程序才继续执行
*/
 

在这里,async默认的设置值为true,这种情况为异步方式,就是说当ajax发送请求后,在等待server端返回的这个过程中,前台会继续 执行ajax块后面的脚本,直到server端返回正确的结果才会去执行success,也就是说这时候执行的是两个线程,ajax块发出请求后一个线程 和ajax块后面的脚本(另一个线程)例:
例3
$.ajax({  
          type:"POST", 
         url:"Venue.aspx?act=init", 
           dataType:"html", 
          success:function(result){   //function1()
             f1(); 
             f2(); 
        } 
         failure:function (result) {  
            alert('Failed');  
         }, 
  } 
  function2(); 
 

在上例中,当ajax块发出请求后,他将停留function1(),等待server端的返回,但同时(在这个等待过程中),前台会去执行function2(),也就是说,在这个时候出现两个线程,我们这里暂且说为function1() 和function2()。
当把asyn设为false时,这时ajax的请求时同步的,也就是说,这个时候ajax块发出请求后,他会等待在function1()这个地方,不会去执行function2(),知道function1()部分执行完毕。
注意
同步的意思是当JS代码加载到当前AJAX的时候会把页面里所有的代码停止加载,页面出去假死状态,当这个AJAX执行完毕后才会继续运行其他代码页面假死状态解除。
而异步则这个AJAX代码运行中的时候其他代码一样可以运行。
jquery的async:false,这个属性
Javascript 相关文章推荐
JavaScript高级程序设计
Dec 29 Javascript
Javascript 函数对象的多重身份
Jun 28 Javascript
jquery 新浪网易的评论块制作
Jul 01 Javascript
多选列表框动态添加,移动,删除,全选等操作的简单实例
Jan 13 Javascript
点击A元素触发B元素的事件在IE8下会识别成A元素
Sep 04 Javascript
JavaScript将取代AppleScript?
Sep 18 Javascript
node.js中的path.delimiter方法使用说明
Dec 09 Javascript
JQuery boxy插件在IE中边角图片不显示问题的解决
May 20 Javascript
微信小程序 wx.request(OBJECT)发起请求详解
Oct 13 Javascript
微信小程序-详解数据缓存
Nov 24 Javascript
解决layui 复选框等内置控件不显示的问题
Aug 14 Javascript
vue.js实现回到顶部动画效果
Jul 31 Javascript
jQuery Ajax异步处理Json数据详解
Nov 05 #Javascript
Javascript脚本实现静态网页加密实例代码
Nov 05 #Javascript
客户端js性能优化小技巧整理
Nov 05 #Javascript
js倒计时小程序
Nov 05 #Javascript
js实现幻灯片效果(基于jquery插件)
Nov 05 #Javascript
javascript使用location.search的示例
Nov 05 #Javascript
jquery按回车提交数据的代码示例
Nov 05 #Javascript
You might like
为什么《星际争霸》是测试人工智能的理想战场
2019/12/03 星际争霸
rrmdir php中递归删除目录及目录下的文件
2011/05/15 PHP
PHP生成压缩文件实例
2015/02/07 PHP
PHP实现无限级分类(不使用递归)
2015/10/22 PHP
2款PHP无限级分类实例代码
2015/11/11 PHP
深入浅析Yii admin的权限控制
2016/08/31 PHP
php实现有序数组打印或排序的方法【附Python、C及Go语言实现代码】
2016/11/10 PHP
详解Yii2 定制表单输入字段的标签和样式
2017/01/04 PHP
Centos7 Yum安装PHP7.2流程教程详解
2019/07/02 PHP
Uglifyjs(JS代码优化工具)入门 安装使用
2020/04/13 Javascript
angularJS中router的使用指南
2015/02/09 Javascript
浅谈jquery事件处理
2015/04/24 Javascript
JavaScript取得键盘按下方向键是哪个的方法
2015/08/04 Javascript
JS响应鼠标点击实现两个滑块区间拖动效果
2015/10/26 Javascript
浅析Bootstrap表格的使用
2016/06/23 Javascript
jQuery Easyui Datagrid实现单行的上移下移及保存移动的结果
2016/08/15 Javascript
每个程序员都需要学习 JavaScript 的7个理由小结
2016/09/03 Javascript
JS中Array数组学习总结
2017/01/18 Javascript
Angular企业级开发——MVC之控制器详解
2017/02/20 Javascript
jquery实现异步加载图片(懒加载图片一种方式)
2017/04/24 jQuery
VueJS 集成 Medium Editor的示例代码 (自定义编辑器按钮)
2017/08/24 Javascript
js的函数的按值传递参数(实例讲解)
2017/11/16 Javascript
Jquery动态列功能完整实例
2019/08/30 jQuery
JavaScript实现更换背景图片
2019/10/18 Javascript
python Django批量导入不重复数据
2016/03/25 Python
python读取和保存视频文件
2018/04/16 Python
使用python将图片按标签分入不同文件夹的方法
2018/12/08 Python
10 分钟快速入门 Python3的教程
2019/01/29 Python
python 读写文件包含多种编码格式的解决方式
2019/12/20 Python
PyInstaller的安装和使用的详细步骤
2020/06/02 Python
一个入门级python爬虫教程详解
2021/01/27 Python
面向对象编程是如何提高软件开发水平的
2014/05/06 面试题
盛大二次面试题
2016/11/18 面试题
计算机开发个人求职信范文
2013/09/26 职场文书
CSS 实现多彩、智能的阴影效果
2021/05/12 HTML / CSS
解决Vmware虚拟机安装centos8报错“Section %Packages Does Not End With %End. Pane Is Dead”
2022/06/01 Servers