您的位置:首页 > Web前端 > JQuery

jquery的$.ajax async使用详解

2015-11-29 20:30 519 查看
async在jquery ajax中是一个同步参数了,我们下面来给大家介绍在jquery ajax中使用async时碰到的一些问题与方法介绍,希望例子能给各位同学带来一些帮助哦。

async默认是true, 即为异步方式, $.Ajax执行后, 会继续执行ajax后面的脚步, 直到服务器端返回数据后, 触发$.Ajax里的success方法. 这时候执行的是两个线程.

var temp;
$.ajax({
async: false,
type : "POST",
url : defaultPostData.url,
dataType : 'json',
success : function(data) {
temp=data;
}
});
alert(temp);


这个ajax请求则为同步请求,在没有返回值之前,alert(temp)是不会执行的。

如果async设置为:true,则不会等待ajax请求返回的结果,会直接执行ajax后面的语句。

附注:

异步就相当于将ajax 请求以一个线程的方式启动

同步就相当于将ajax 请求逐步执行只有ajax 请求执行文笔后才会执行后面的语句。

例子

<form action="1.jsp">
<input type="text" id="tel" flag="0"/>
<input type="text" id=www.111cn.net flag="0"/>
<input type="submit" value="提交" />
</form>
<script>
$('#tel,#email').blur(function(){
var _this=this;
$.ajax({
type:'POST',
url:'',
//async:false,
dataType:'text',
//data:'',
success:function(data){
if(data==true){
$(_this).attr('flag',1)
}
}
});
});

$('form').submit(function(){
var isSubmit=true;
var input=$('input:text');
for(var i=0; i<input.length;i++){
input.eq(i).blur(); //点击提交 重新做一次验证
if(input.eq(i).attr('flag')==0){
isSubmit=false;
}
}
alert(isSubmit);
return isSubmit;
});
</script>


码如上,点击“提交”,所有输入框做一次ajax验证,如果都返回true,则提交表单;

如果不注释掉:async:false 没问题,但注释掉后,因为是异步传输,submit的时flag值还没来得及返回,所以都为false

表单提交不了

求:如果选择默认的async:true 该怎么判断,然后提交

ajax的async参数导致火狐浏览器闪屏

我的出现闪屏 的情况是:

$.ajax({

type: "post",

url: "index.php",

data: { },

async:false,

beforeSend:function(){},

success: function(data){

//...

},

complete:function(){}

});

在这里, 我的async设为了false, 原意是想返回数据了再执行$.Ajax后面的脚本, 没想到这个地方却导致了在火狐浏览器下出现闪屏.(Firefox 11.0), 滚动条下拉到底部触发ajax的情况.闪屏

最后将async:false注释掉, 也就是async为ture的情况下, 成功解决了火狐浏览器滚动条下拉到底部触发ajax出现闪屏的问题.
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: