jquery.ajax之beforeSend方法使用介紹_jquery

常見的一種效果，在用ajax請求時，沒有返回前會出現前出現一個轉動的loading小圖標或者“內容加載中..”，用來告知用戶正在請求數據。這個就可以用beforeSend方法來實作。

下載demo：ajax loading

程式碼如下：

複製程式碼 程式碼如下:

function test_ajax(){
   $.ajax(
   {
      type:"GET",//通常會用到兩種：GET,POST。預設是：GET
      url:"a.php",//(預設: 目前頁位址) 寄送請求的位址
      dataType:"html",//預期伺服器傳回的資料型別。
      beforeSend:beforeSend, //傳送請求
      success:callback, //請求成功
      error:error,//請求出錯
      complete:complete//請求完成
   });
}
function error(XMLHttpRequest, textStatus, errorThrown){
  // 通常情況下textStatus和errorThown只有其中一個有值
  $("#showResult").append("

請求出錯！

");
}
function beforeSend(XMLHttpRequest){
  $("#showResult").append("

");
}
function complete(XMLHttpRequest, textStatus){
  $("#showResult").remove();
}
function callback(msg){
  $("#showResult").append("

請求成功，回傳數:" msg "

");
}

方法beforeSend，用於在向伺服器發送請求之前添加一些處理函數。這是一個ajax事件，在ajax請求開始之前就被觸發，通常允許用戶修改XMLHttpRequest物件（比如說設定附加的頭部資訊），關於ajax事件的解釋可參考文件：http://docs. jquery.com/Ajax_Events

我們還見到一種情況，許多網站在載入內容的過程中給出「資料載入中，請稍候」的提示，當內容被載入完畢後顯示內容。可以設定預設文字顯示為載入中的提示，當內容載入完畢時，我們可以透過ID選擇器，將該標籤中的文字替換成最終的內容。以此取代beforeSend，效率更高。

何時用beforeSend，什麼時候用文字替換，取決於ajax請求前後你所展示的DOM元素是否一致，如果你所展示的DOM元素在請求之前已經存在，那麼透過上述文字替換的方式來處理會好些，如果除此之外你還需增加其他的需求，那麼還是用beforeSend來處理吧。