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 写类方式之二
Jul 05 Javascript
用Move.js配合创建CSS3动画的入门指引
Jul 22 Javascript
超链接怎么正确调用javascript函数
May 23 Javascript
Javascript中arguments对象的详解与使用方法
Oct 04 Javascript
javascript函数的四种调用模式
Jan 08 Javascript
JavaScript轻松创建级联函数的方法示例
Feb 10 Javascript
jQuery实现 上升、下降、删除、添加一行代码
Mar 06 Javascript
ES6入门教程之Iterator与for...of循环详解
May 17 Javascript
vue 录制视频并压缩视频文件的方法
Jul 27 Javascript
jquery拖拽自动排序插件使用方法详解
Jul 20 jQuery
javascript写一个ajax自动拦截并下载数据代码实例
Sep 07 Javascript
vue + elementUI实现省市县三级联动的方法示例
Oct 29 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
PHP获取MAC地址的具体实例
2013/12/13 PHP
php处理restful请求的路由类分享
2014/02/27 PHP
JavaScript与DropDownList 区别分析
2010/01/01 Javascript
多浏览器支持的右下角浮动窗口
2010/04/01 Javascript
客户端 使用XML DOM加载json数据的方法
2010/09/28 Javascript
javascript获取和判断浏览器窗口、屏幕、网页的高度、宽度等
2014/05/08 Javascript
jquery实现聚光灯效果的方法
2015/02/06 Javascript
js实现当前输入框高亮显示的方法
2015/08/19 Javascript
javascript Slip.js实现整屏滑动的手机网页
2015/11/25 Javascript
JavaScript 浏览器兼容性总结及常用浏览器兼容性分析
2016/03/30 Javascript
js表单验证实例讲解
2016/03/31 Javascript
jQuery实现加入收藏夹功能(主流浏览器兼职)
2016/12/24 Javascript
jQuery插件FusionCharts实现的MSBar3D图效果示例【附demo源码】
2017/03/23 jQuery
Vue.js 2.5新特性介绍(推荐)
2017/10/24 Javascript
深入浅析Vue.js中 computed和methods不同机制
2018/03/22 Javascript
webstrom Debug 调试vue项目的方法步骤
2018/07/17 Javascript
d3.js 地铁轨道交通项目实战
2019/11/27 Javascript
vue实现多个echarts根据屏幕大小变化而变化实例
2020/07/19 Javascript
vue+elementUI(el-upload)图片压缩,默认同比例压缩操作
2020/08/10 Javascript
JS实现悬浮球只在一侧滑动并且是横屏状态下
2020/08/19 Javascript
Python写的PHPMyAdmin暴力破解工具代码
2014/08/06 Python
python求质数的3种方法
2018/09/28 Python
更改Python的pip install 默认安装依赖路径方法详解
2018/10/27 Python
pycharm 在windows上编辑代码用linux执行配置的方法
2018/10/27 Python
深入浅析Python中的迭代器
2019/06/04 Python
python global和nonlocal用法解析
2020/02/03 Python
python线性插值解析
2020/07/05 Python
英国袜子店:Sock Shop
2017/01/11 全球购物
Berghaus官网:户外服装和设备,防水服
2020/01/17 全球购物
酒店经理职责
2014/01/30 职场文书
父母寄语大全
2014/04/12 职场文书
欧也妮葛朗台读书笔记
2015/06/30 职场文书
2016年教师反腐倡廉心得体会
2016/01/13 职场文书
优秀家长事迹材料(2016推荐版)
2016/02/29 职场文书
MySQL的Query Cache图文详解
2021/07/01 MySQL
Javascript 解构赋值详情
2021/11/17 Javascript