首頁 > web前端 > js教程 > 主體

jquery中的ajax同步與非同步詳解

亚连
發布: 2018-05-25 09:55:33
原創
2127 人瀏覽過

jquery ajax同步的意思是當JS程式碼載入到目前ajax的時候會把頁面裡所有的程式碼停止載入,頁面出現了假死狀態,當這個ajax執行完畢後才會繼續運行其他的程式碼假死狀態解除。而異步的意思是這個ajax程式碼運行中的時候其他程式碼一樣可以運行。本文給大家詳解,有興趣的朋友參考下

之前一直在寫JQUERY程式碼的時候遇到AJAX載入資料都需要考慮程式碼運行順序問題。最近的專案用了到AJAX同步。這個同步的意思是當JS程式碼載入到目前AJAX的時候會把頁面裡所有的程式碼停止載入,頁面出去假死狀態,當這個AJAX執行完畢後才會繼續運行其他程式碼頁面假死狀態解除。

而異步則這個AJAX程式碼運行中的時候其他程式碼一樣可以運行。

jquery的async:false,這個屬性

預設是true:非同步,false:同步。

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

有了這個屬性可以相對的減少程式碼執行書序問題,但是如果用的太多,頁面假死次數太多。這樣反而導致使用者體驗不佳~!

$.Ajax()中async 和success的官方的解釋:

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.
登入後複製

在這裡,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) { 
      alert('Failed'); 
     }, 
 }
登入後複製

  function2();

在上例中,當ajax區塊發出請求後,他將停留function1(),等待server端的返回,但同時(在這個等待過程中),前台會去執行function2(),也就是說,在這個時候出現兩個線程,我們這裡暫且說為function1() 和function2()。

          當asyn設為false時,這時ajax的請求時同步的,也就是說,這時候ajax區塊發出請求後,他會等待在function1()這個地方,不會去執行function2 (),知道function1()部分執行完畢。

上面是我整理給大家的,希望今後對大家有幫助。

相關文章:

Jquery具體實例介紹AJAX何時用,AJAX應該在什麼地方用

jquery與php結合實作AJAX長輪詢

初步了解JavaScript,Ajax,jQuery,並比較三者關係

以上是jquery中的ajax同步與非同步詳解的詳細內容。更多資訊請關注PHP中文網其他相關文章!

相關標籤:
來源:php.cn
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板