jquery中ajax方法有个属性async用于控制同步和异步,默认是true,即ajax请求默认是异步请求,有时项目中会用到AJAX同步。这个同步的意思是当JS代码加载到当前AJAX的时候会把页面里所有的代码停止加载,页面出现假死状态,当这个AJAX执行完毕后才会继续运行其他代码页面假死状态解除。而异步则这个AJAX代码运行中的时候其他代码一样可以运行。

ajax中async这个属性,用于控制请求数据的方式,默认是true,即默认以异步的方式请求数据。

一、async值为true (异步)

当ajax发送请求后,在等待server端返回的这个过程中,前台会继续 执行ajax块后面的脚本,直到server端返回正确的结果才会去执行success,也就是说这时候执行的是两个线程,ajax块发出请求后一个线程 和ajax块后面的脚本(另一个线程)

例如

1
2
3
4
5
6
7
8
9
10
11
12
13
$.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()。

二、async值为false (同步)

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

例如

1
2
3
4
5
6
7
8
9
10
11
12
13
14
$.ajax({ 
     type:"POST",
     url:"Venue.aspx?act=init",
     dataType:"html",
     async: false,
    success:function(result){  //function1()
       f1();
       f2();
     }
    failure:function (result) { 
      alert('Failed'); 
     },
 }
 function2();

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

Ajax同步与异步的区别

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
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状态值!下面是异步和同步的不同调用方式:

Java

1
2
3
4
5
6
7
8
9
10
xmlHttpReq.open("GET",url,true);//异步方式
  xmlHttpReq.onreadystatechange = showResult; //showResult是回调函数名
  xmlHttpReq.send(null);
function showResult(){ 
  if(xmlHttpReq.readyState == 4){  
   if(xmlHttpReq.status == 200){
   ******
   }
  }
}

Java

1
2
3
4
5
6
7
8
9
10
11
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。

ajax同步与异步的区别的更多相关文章

  1. JQ Ajax 同步与异步的区别

    $.ajax({ url: xml_addr, type: 'get', dataType: 'xml', timeout: 1000, //设定超时 cache: false, //禁用缓存 asy ...

  2. Ajax同步和异步的区别?

    今天在code review时候看到同事的代码,用了ajax同步,async:false,如果不设置async参数,默认是true,为异步,异步的情况是比较复杂的,看下同步这个例子: function ...

  3. ajax 同步和异步的区别

    举个例子:普通B/S模式(同步)AJAX技术(异步)同步:提交请求->等待服务器处理->处理完毕返回 这个期间客户端浏览器不能干任何事异步: 请求通过事件触发->服务器处理(这时浏览 ...

  4. AJAX同步和异步的区别

    function paginationGo(page){ sendata = {"page":page}; $.ajax({ type:"POST", url: ...

  5. Ajax 是什么?Ajax 的交互模型?同步和异步的区别?如何解决跨域问题?以及 HTTP状态码

    一.Ajax 是什么: 1. 通过异步模式,提升了用户体验 2. 优化了浏览器和服务器之间的传输,减少不必要的数据往返,减少了带宽占用 3. Ajax 在客户端运行,承担了一部分本来由服务器承担的工作 ...

  6. Ajax 的概念及过程?Ajax 的交互模型?同步和异步的区别?如何解决跨域问题?

    Ajax 是什么: 1)  通过异步模式,提升了用户体验 2)  优化了浏览器和服务器之间的传输,减少不必要的数据往返,减少了带宽占用 3)  Ajax 在客户端运行,承担了一部分本来由服务器承担的工 ...

  7. AJAX是什么? AJAX的交互模型(流程)?同步和异步的区别? AJAX跨域的解决办法?

      AJAX是什么? AJAX的交互模型(流程)?同步和异步的区别? AJAX跨域的解决办法? 分类: web前端面试题2013-07-20 22:40 630人阅读 评论(0) 收藏 举报 目录(? ...

  8. ajax同步与异步的坑

      之前工作中一个需求,需要动态的添加一组下拉菜单并为这个菜单绑定一个插件,很明显获取数据用Ajax,这本身是没错的,坑就坑在我用了 同步请求,当服务器端正确返回数据时再去执行下一个方法,这逻辑本身没 ...

  9. Java常见的同步和异步的区别、特点、联系

    Java常见的同步和异步的区别.特点.联系   同步:发送一个请求,等待返回,然后再发送下一个请求 异步:发送一个请求,不等待返回,随时可以再发送下一个请求 同步可以避免出现死锁,读脏数据的发生,一般 ...

随机推荐

  1. SecureCRT字体、界面优化

    SecureCRT字体.界面优化 本文是secureCRT的第三篇博文,也是目前secureCRT优化的最终篇.首次使用该软件时候.应该会设置字体和编码,接下来,将演示如何设置. 1. 字体.编码设置 ...

  2. Qt信号-槽原理剖析--(2)自己实现信号槽

    时间乃是最大的革新家--培根 先了解一下相关宏: qt为c++增加的相关宏:signals, slots,emit 在qt的预编译过程中,这些宏会被替换. 1)#define signals publ ...

  3. git stash详解

        应用场景: 1 当正在dev分支上开发某个项目,这时项目中出现一个bug,需要紧急修复,但是正在开发的内容只是完成一半,还不想提交,这时可以用git stash命令将修改的内容保存至堆栈区,然 ...

  4. tidb测试环境搭建

    tidb ansible 部署方式环境检查过于严格,测试环境往往达不到标准,需调整一些参数才能部署成功. 基于tidb2.0版本需要调整的参数 [tidb@ansible01 tidb-ansible ...

  5. [LOJ2541] [PKUWC2018] 猎人杀

    题目链接 LOJ:https://loj.ac/problem/2541 Solution 很巧妙的思路. 注意到运行的过程中概率的分母在不停的变化,这样会让我们很不好算,我们考虑这样转化:假设所有人 ...

  6. C# vb .net实现透视反射效果

    在.net中,如何简单快捷地实现Photoshop滤镜组中的透视反射效果呢?答案是调用SharpImage!专业图像特效滤镜和合成类库.下面开始演示关键代码,您也可以在文末下载全部源码: 设置授权 第 ...

  7. src属性与浏览器渲染

    img标签 只要设置了src属性, 就会开始下载,因此可以使用这个特性,配合display:none,默默的下载一些图片,用的时候直接用,快了那么一丢丢~ 注意:不一定要添加到文档后才会开始下载,是只 ...

  8. python 数据类型 常用法方

    python 数据类型 常用法方 upper() 大写 str lower() 小写 str strip() rstrip() lstrip() 去除字符两边的空格 去右边 左边空白 str repl ...

  9. 解决问题 inner element must either be a resource reference or empty.

    -Q: 错误<item>内部元素必须是资源引用或空 升级Andriod Studio之后编译发现如下错误 Android resource compilation failed ***\a ...

  10. ArrayList集合实现RandomAccess接口有何作用?为何LinkedList集合却没实现这接口

    详见:https://blog.csdn.net/weixin_39148512/article/details/79234817 众所周知,在List集合中,我们经常会用到ArrayList以及Li ...