jquery ajax阻塞,jquery ajax（同步和异步）请求方式与提示用户正在处理请稍等

初次使用$.ajax()

,我没有去区分过ajax的异步请求和同步请求的不同，刚开始使用同步请求，以至后来出现许多问题，特别在体验度方面。异步和同步：同步意味着执行完一段程序才能执行下一段，它属于阻塞模式，其表现在网页上的现象是——浏览器会锁定页面(即所谓的页面假死状态)，用户不能操作其它的，必须等待当前请求返回数据。而使用异步方式请求，页面不会出现假死现象。提升用户体验度：当用户提交数据等待页面返回结果是需要时间的，有时这段等待时间比较长，为了提高用户体验度，我们通常会给出

“正在处理，请稍等！”诸如此类的提示。我们可通过设置$.ajax()下的参数beforeSend()来实现，eg: html关键代码

《div

id="warning"》《/div》

js文件中的关键代码

$.ajax(function(){

/ /省略了一些参数，这里只给出async 和 beforeSend

async: false, /

/同步请求，默认情况下是异步(true)

beforeSend:

function(){

$('#warning').text('正在处理，请稍等！');

}

});

注意，如果你按照同步设置 async: false,

$('#warning').text('正在处理，请稍等！');在网页中根本没有出现效果，如果将$('#warning').text('正在处理，请稍等！');换成

alert(‘test')；在发送请求前会立即看到弹出框，这说明 beforeSend:是执行了，但是换成别的诸如

$('#warning').text('正在处理，请稍等！');

在请求发出返回结果了都没有看到提示出现。关于这个问题，我是纳闷了很久，问题到底是什么我还是不清楚。把同步请求改成异步请求，上面的问题就没有了，

beforeSend:

function(){

$('#warning').text('正在处理，请稍等！');

}

会立即被执行。

转载网址：http://www.jb51.net/article/54596.htm

一、async值为true (异步)

当ajax发送请求后，在等待server端返回的这个过程中，前台会继续

执行ajax块后面的脚本，直到server端返回正确的结果才会去执行success，也就是说这时候执行的是两个线程，ajax块发出请求后一个线程

和ajax块后面的脚本(另一个线程)

例如:

$.ajax({

type:"POST",

url:"Venue.aspx?act=init",

dataType:"html",

success:function(result){

/ /function1()

f1();

f2();

}

failure:function

(result) {

;

},

}

function2();

在上例中，当ajax块发出请求后，他将停留function1()，等待server端的返回，但同时(在这个等待过程中)，前台会去执行function2()。

二、async值为false (同步)

当执行当前AJAX的时候会停止执行后面的JS代码，直到AJAX执行完毕后时，才能继续执行后面的JS代码。

例如:

$.ajax({

type:"POST",

url:"Venue.aspx?act=init",

dataType:"html",

async:

false,

success:function(result){

/ /function1()

f1();

f2();

}

failure:function

(result) {

;

},

}

function2();

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

Ajax同步与异步的区别

​var returnValue =

null;

xmlhttp = createXmlHttp();

xmlhttp.onreadystatechange = function() {

if(xmlhttp.readyState

== 4 &&

xmlhttp.status == 200) {

if

(xmlhttp.responseText == "true")

{

returnValue

= "true";

}

else

{

returnValue

= "false";

}

}

};

xmlhttp.open("Post",url,true);

/ /异步传输

xmlhttp.setRequestHeader("If-Modified-Since","0");

/ /不缓存Ajax

xmlhttp.send(sendStr);

return returnValue;

在异步时才可以用xmlHttpReq.onreadystatechange状态值！下面是异步和同步的不同调用方式：

xmlHttpReq.open("GET",url,true);/

/异步方式

xmlHttpReq.onreadystatechange

= showResult; / /showResult是回调函数名

xmlHttpReq.send(null);

function showResult(){

if(xmlHttpReq.readyState

==

4){

if(xmlHttpReq.status

== 200){

******

}

}

}

xmlHttpReq.open("GET",url,false);//同步方式

xmlHttpReq.send(null);

showResult();

/ /showResult虽然是回调函数名但是具体用法不一样~

function

showResult(){

/

/if(xmlHttpReq.readyState == 4){

这里就不用了，直接dosomething吧~

/

/if(xmlHttpReq.status == 200){

******/

/dosomething

//}

//}

}

xmlhttp.open("Post",url,true);

如果是同步(false)，返回值是true或false，因为执行完send后，开始执行onreadystatechange，程序会等到onreadystatechange都执行完，取得responseText后才会继续执行下一条语句，所以returnValue一定有值。

如果是异步(true)，返回值一定是null，因为程序执行完send后不等xmlhttp的响应，而继续执行下一条语句，所以returnValue还没有来的及变化就已经返回null了。

所有如果想获得xmlhttp返回值必须用同步，异步无法得到返回值。

同步异步使用xmlhttp池时都要注意：取得xmlhttp时只能新建xmlhttp，不能从池中取出已用过的xmlhttp，因为被使用过的xmlhttp的readyState为4，所以同步异步都会send但不执行onreadystatechange。

转载地址：http://www.jb51.net/article/73936.htm

​

​