Detailed explanation of ajax synchronization and asynchronousness in jquery

jquery ajax synchronization means that when the JS code is loaded into the current ajax, all the code in the page will stop loading, and the page will appear in a state of suspended animation. When the ajax is completed, it will continue to run other codes. The suspended state will be lifted. . Asynchronous means that other codes can run while this ajax code is running. This article will give you a detailed explanation. Interested friends can refer to

. When I have been writing JQUERY code before, I need to consider the code running order when encountering AJAX loading data. Recent projects have used AJAX synchronization. What this synchronization means is that when the JS code is loaded into the current AJAX, all the code in the page will stop loading, and the page will go out of suspended animation state. When the AJAX is completed, it will continue to run other codes and the page suspended animation state will be lifted.

Asynchronously, other codes can run while this AJAX code is running.

jquery's async:false, this attribute

The default is true: asynchronous, false: synchronous.

$.ajax({ 
    type: "post", 
    url: "path", 
    cache:false, 
    async:false, 
    dataType: ($.browser.msie) ? "text" : "xml", 
     success: function(xmlobj){ 
    } 
});

Having this attribute can relatively reduce the problem of code running book order, but if it is used too much, the page will freeze too many times. This will lead to poor user experience~!

$.The official explanation of async and success in Ajax():

async 
Boolean 
Default: true
By default, all requests are sent asynchronous (e.g. this is set to true by default). If you need synchronous requests, set this option to false. Note that synchronous requests may temporarily lock the browser, disabling any actions while the request is active.
success 
Function
A function to be called if the request succeeds. The function gets passed two arguments: The data returned from the server, formatted according to the 'dataType' parameter, and a string describing the status. This is an Ajax Event.

Here, the default setting value of async is true, This situation is asynchronous, which means that after Ajax sends a request, while waiting for the server to return, the front desk will continue to execute the script behind the Ajax block. Success will not be executed until the server returns the correct result, that is, It is said that two threads are executed at this time, one thread after the ajax block sends the request and the script (another thread) after the ajax block. Example:

$.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 sends a request, it will stay in function1() and wait for the return from the server, but at the same time (during this waiting process), the front desk Function2() will be executed, that is to say, two threads will appear at this time, let's call them function1() and function2() here.

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 the function1() part is executed.

The above is what I compiled for everyone. I hope it will be helpful to everyone in the future.

Related articles:

Jquery specific examples introduce when to use AJAX and where AJAX should be used

jquery and PHP combines to implement AJAX long polling

##Initially understand JavaScript, Ajax, jQuery, and compare the relationship between the three

The above is the detailed content of Detailed explanation of ajax synchronization and asynchronousness in jquery. For more information, please follow other related articles on the PHP Chinese website!