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 相关文章推荐
jQuery弹性滑动导航菜单实现思路及代码
May 02 Javascript
向左滚动文字 js代码效果
Aug 17 Javascript
客户端js性能优化小技巧整理
Nov 05 Javascript
JavaScript输出当前时间Unix时间戳的方法
Apr 06 Javascript
js实现楼层效果的简单实例
Jul 15 Javascript
JavaScript浏览器对象模型BOM(BrowserObjectModel)实例详解
Nov 29 Javascript
vue组件学习教程
Sep 09 Javascript
jQuery实现的粘性滚动导航栏效果实例【附源码下载】
Oct 19 jQuery
新版vue-cli模板下本地开发环境使用node服务器跨域的方法
Apr 03 Javascript
Vue 组件传值几种常用方法【总结】
May 28 Javascript
vue+axios新手实践实现登陆的示例代码
Jun 06 Javascript
vue中data改变后让视图同步更新的方法
Mar 29 Vue.js
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 和 XML: 使用expat函数(三)
2006/10/09 PHP
用PHP函数解决SQL injection
2006/12/09 PHP
PHP中使用php5-ffmpeg撷取视频图片实例
2015/01/07 PHP
PHP实现二维数组去重功能示例
2017/01/12 PHP
ThinkPHP5框架缓存查询操作分析
2018/05/30 PHP
PDO::getAvailableDrivers讲解
2019/01/28 PHP
php使用fputcsv实现大数据的导出操作详解
2020/02/27 PHP
node.js中使用node-schedule实现定时任务实例
2014/06/03 Javascript
jQuery中:header选择器用法实例
2014/12/29 Javascript
jQuery操作JSON的CRUD用法实例
2015/02/25 Javascript
JS 清除字符串数组中,重复元素的实现方法
2016/05/24 Javascript
JavaScript代码实现图片循环滚动效果
2020/03/19 Javascript
JQuery对ASP.NET MVC数据进行更新删除
2016/07/13 Javascript
AngularJs concepts详解及示例代码
2016/09/01 Javascript
jQuery中常用动画效果函数(日常整理)
2016/09/17 Javascript
jQuery实现表格文本框淡入更改值后淡出效果
2016/09/27 Javascript
jquery自定义表单验证插件
2016/10/12 Javascript
[原创]javascript typeof id==='string'?document.getElementById(id):id解释
2016/11/02 Javascript
基于bootstrap按钮式下拉菜单组件的搜索建议插件
2017/03/25 Javascript
VuePress 快速踩坑小结
2019/02/14 Javascript
微信小程序 wx.getUserInfo引导用户授权问题实例分析
2020/03/09 Javascript
JavaScript 中的执行上下文和执行栈实例讲解
2021/02/25 Javascript
[02:28]DOTA2亚洲邀请赛 LGD战队巡礼
2015/02/03 DOTA
[50:04]DOTA2上海特级锦标赛D组小组赛#2 Liquid VS VP第二局
2016/02/28 DOTA
[04:31]2016国际邀请赛中国区预选赛妖精采访
2016/06/27 DOTA
深入解析Python中的lambda表达式的用法
2015/08/28 Python
基于python历史天气采集的分析
2019/02/14 Python
Pycharm如何打断点的方法步骤
2019/06/13 Python
Python 根据数据模板创建shapefile的实现
2019/11/26 Python
css3背景_动力节点Java学院整理
2017/07/11 HTML / CSS
深入探究HTML5的History API
2015/07/09 HTML / CSS
Laravel的加密解密与哈希实例讲解
2021/03/24 PHP
美容院合作经营协议书
2014/10/10 职场文书
党建工作目标管理责任书
2015/01/29 职场文书
2015夏季作息时间调整通知
2015/04/24 职场文书
MySQL非空约束(not null)案例讲解
2021/08/23 MySQL