Detailed example of ajax attribute async in jQuery

In our daily development work, ajax is knowledge that we all need to learn. So in jquery's ajax, if we want to achieve synchronization or asynchronousness, we can directly set async occurrence to true or false. It can be true or false. Today we will introduce you to the example of ajaxattributeasync in jQuery!

Example 1, jquery+ajax/" target="_blank">jquery ajax synchronization method

The code is as follows:

$.ajax({
url : 'test.php',
type : 'post',
async: false,//使用同步的方式,true为异步方式
data : {'act':'addvideo', 'videoname':videoname},//这里使用json对象
success : function(data){
//code here...
},
fail:function(){
//code here...
}
});

Example 2

The code is as follows:

//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返回结果后程序才继续执行
*/

Here, the default setting value of async is true. In this case, it is an asynchronous method, which means that after ajax sends the request, it is waiting for the server to return. , the front desk will continue to execute the script after the ajax block, and will not execute success until the server returns the correct result. That is to say, two threads are executed at this time, one thread after the ajax block sends the request and the script after the ajax block ( Another thread) Example:
Example 3

The code is as follows:

$.ajax({  
          type:"POST", 
         url:"Venue.aspx?act=init", 
           dataType:"html", 
          success:function(result){   //function1()
             f1(); 
             f2(); 
        } 
         failure:function (result) {  
            alert('Failed');  
         }, 
  } 
  function2();

In the above example, when the ajax block makes a request, he will stay in function1() and wait. The server side returns, but at the same time (during this waiting process), the front desk will execute function2(), that is to say, two threads will appear at this time, let's call them function1() and function2() for now
. When asyn is set to false, the ajax request is synchronous. That is to say, after the ajax block sends a request at this time, it will wait at function1() and will not execute function2() until function1( ) partially executed.

Summary:

Synchronization means that when the JS code is loaded into the current AJAX, the page will be loaded. All the code in it stops loading, and the page goes out of the suspended state. When this AJAX is executed, other codes will continue to run. The suspended state will be released. Async: jquery's async: false can still run while the AJAX code is running. , this attribute

Related recommendations:

async and defer usage in script tags

Detailed explanation of ES6's async+await synchronization/asynchronous solution

Detailed explanation of the usage of async in javascript

The above is the detailed content of Detailed example of ajax attribute async in jQuery. For more information, please follow other related articles on the PHP Chinese website!