全局Ajax事件處理程序：.ajaxComplete()

詳細內容
分類：JQuery
發佈：2013-08-12, 週一 21:08
點擊數：2545

(PS:這篇文章是從官網非專業翻譯+個人意見，並且重新排版過)

全局Ajax事件處理程序：.ajaxComplete()

註冊一個處理程序，當Ajax要求完成時該處理程序會被呼叫。這是一個Ajax事件(AjaxEvent)。

語法一：

.ajaxComplete( handler(event, XMLHttpRequest, ajaxOptions) )   // version added: 1.0

     handler(event, XMLHttpRequest, ajaxOptions)：handler是個回呼函式，當事件發生時該函式會被調用。

不論何時，當Ajax要求完成時，jQuery會觸發ajaxComplete事件。此時，每個用.ajaxComplete()註冊的處理程序都會被執行。

建立一個基本的Ajax載入要求來實際觀察這個方法：

<div class="trigger">Trigger</div>
<div class="result"></div>
<div class="log"></div>

將下面的事件處理器附加到文件上：

$( document ).ajaxComplete(function() {
  $( ".log" ).text( "Triggered ajaxComplete handler." );
});

現在，用jQuery方法來建立一個Ajax要求：

$( ".trigger" ).click(function() {
  $( ".result" ).load( "ajax/test.html" );
});
當使用者按下具有trigger類別的元素並且在Ajax要求完成時，log訊息就會出現。

從jQuery1.8開始，.ajaxComplete()方法應該只被附加到document上。

不論是哪個Ajax要求完成時，所有的ajaxComplete處理程序都會被呼叫。假如你需要區分那些要求，可以利用傳遞給處理程序的參數。每一次當ajaxComplete處理程序被執行時，該處理程序會被收到三個參數：事件物件，XMLHttpRequest 物件，以及要求建立時會被使用的設定物件。例如說你可以限制回呼函式只對具有特定URL的事件進行處理。(譬如下面的例子只對 settings.url === "ajax/test.html" 的事件進行處理，PS: 處理程序的三個參數都是jQuery呼叫該程序時會自動給的)

$( document ).ajaxComplete(function( event, xhr, settings ) {
  if ( settings.url === "ajax/test.html" ) {
    $( ".log" ).text( "Triggered ajaxComplete handler. The result is " +
      xhr.responseHTML );
  }
});

注意：你可以用xhr.responseXML 或是 xhr.responseHTML來取得傳回的Ajax內容，responseXML是XML內容，而responseHTML是HTML內容。






	其他注意事項：


    
	
  • 
		假如$.ajax()或是$.ajaxSetup()在呼叫時設定global選項為false，那.ajaxComplete()方法將不會被觸發。
    • 




	範例：



	當Ajax要求完成時，顯示一個訊息。


$( document ).ajaxComplete(function( event,request, settings ) {
  $( "#msg" ).append( "<li>Request Complete.</li>" );
});



			

						



	












   



  

     

  

      按個讚!~支持本站!~





  

    FB推薦載入中