jquery中ajax的相關事件匯總

標籤：modify   i++   setting   app   ...   lte   glob   function   com   

Jquery ajax事件分類(一) 局部事件 local events

局部事件：在單個Ajax請求對象中綁定的事件，每個 Ajax 請求對象能夠依據須要綁定自己的局部事件 。局部事件僅僅會被那個綁定該事件的 Ajax 對象觸發，是屬於單個 Ajax 對象的私人（即局部）事件。此類事件包含：beforeSend、complete、success、error。

$.ajax({   beforeSend: function(){ // Handle the beforeSend event   },   complete: function(){ // Handle the complete event   }  // ...... });

(二) 全域事件 global events

全域事件：除了上面說的局部事件外，跟 Ajax 相關的 jquery 事件還有一類事件——全域事件。如 ajaxSend/ajaxComplete/ajaxError/ajaxSuccess/ajaxStart/ajaxStop。不難發現全域事件與局部事件的命名差別。全域事件的名稱都已 ajax開頭。

全域事件，顧名思義，“全域”的意思指的是整個html文檔中全部 Ajax 請求對象公有的事件，這一類事件不是單個 Ajax 請求私人的事件，所以不能在某個 Ajax 請求中定義這類事件的處理函數。那麼這些全域事件的處理函數在哪裡綁定呢？——綁在 document 對象上。

$(document).bind("ajaxSend", function(){   $("#loading").show(); }).bind("ajaxComplete", function(){   $("#loading").hide(); });

（1）全域事件細化分類

全域事件中又分為2類不同的事件：
1、ajaxStart/ajaxStop的觸發條件是由文檔中的全部Ajax 對象共同影響的。

ajaxStart觸發時刻：jquery官網的解釋是“文檔中某個Ajax 請求已經開始(started)，以此同一時候沒有不論什麼其它正在執行（running）的Ajax 請求”；
這意味著：
假設第一個 Ajax 請求還沒有結束執行時又開始了還有一個 Ajax 請求。那麼 ajaxStart事件僅僅在第一個 Ajax 請求開始時觸發一次；
假設第一個 Ajax 請求已經結束執行，之後又開始了還有一個 Ajax 請求。那麼 ajaxStart事件將在第一個請求開始時觸發一次，在第二個請求開始時再觸發一次。

ajaxStop觸發時刻:”當前執行的 Ajax 請求都已結束”;
這意味著：該事件觸發時文檔中一定沒有正在執行的 Ajax 請求。這個事件可能會被觸發多次。

2、ajaxSend/ajaxComplete/ajaxError/ajaxSuccess的觸發條件則不須要文檔中全部 Ajax請求共同影響，它們的觸發條件非常easy：文檔中每個ajax 請求都會觸發這些事件。

( 2 ) 單個 Ajax 對象怎樣屏蔽全域事件？

既然全域事件的觸發會受到文檔中全部 Ajax 請求對象的影響，那麼當我們希望某個 Ajax 請求不要觸發全域事件時。該怎麼做呢？——僅僅須要將這個 Ajax 對象的 global 參數設定為 false。

$.ajax({   url: "test.html",   global: false,   // ... });

Jquery ajax事件觸發順序和觸發條件

下面排列順序為ajax 事件的觸發順序（從先到後）
1、ajaxStart (Global Event)

This event is triggered if an Ajax request is started and no other Ajax requests are currently running.

2、beforeSend (Local Event)

This event, which is triggered before an Ajax request is started, allows you to modify the XMLHttpRequest object (setting additional headers, if need be.)（//Ajax對象已經產生（started）。但還沒有真正發起網路請求。此事件經常使用來改動 Ajax 對象的要求標頭部。當此事件回呼函數 return false 時，該ajax請求將被取消）

3、ajaxSend (Global Event)

This global event is also triggered before the request is run.

4、success (Local Event)

This event is only called if the request was successful (no errors from the server, no errors with the data).（//成功時即 textStatus=’success/notmodified/nocontent’時觸發。回呼函數中的 data 是 jquery 依據 dataFilter和 dataType進行處理後的資料。

success值通常是一個 function，但也能夠是一個function 數組。數組中的全部 function 將按順序調用 ）

5、ajaxSuccess (Global Event)

This event is also only called if the request was successful.

6、error (Local Event)

This event is only called if an error occurred with the request (you can never have both an error and a success callback with a request).（//textStatus=’error/timeout/abort/parseerror’時調用，error值通常是一個 function，但也能夠是一個function 數組，數組中的全部 function 將按順序調用 ）

7、ajaxError (Global Event)

This global event behaves the same as the local error event.

8、complete (Local Event)

This event is called regardless of if the request was successful, or not. You will always receive a complete callback, even for synchronous requests.（//無論請求success還是error，無論請求是同步還是非同步，都會觸發該事件。此事件處理函數中的 textStatus參數可能取值為：”success”, “notmodified”, “nocontent”, “error”, “timeout”, “abort”, or “parsererror”。complete值通常是一個 function，但也能夠是一個function 數組，數組中的全部 function 將按順序調用 ）

9、ajaxComplete (Global Event)

This event behaves the same as the complete event and will be triggered every time an Ajax request finishes.

10、ajaxStop (Global Event)

This global event is triggered if there are no more Ajax requests being processed.

jquery中ajax的相關事件匯總