jq ajax之beforesend(XHR)

用於在向服務器發送請求前添加一些處理函數。例如：搜尋附近店鋪，未搜尋出來的時候顯示：正在搜尋中...

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

 

代碼以下:

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("<div>請求出錯啦！</div>");
}
function beforeSend(XMLHttpRequest){
  $("#showResult").append("<div><img src='loading.gif' /><div>");
}
function complete(XMLHttpRequest, textStatus){
  $("#showResult").remove();
}
function callback(msg){
  $("#showResult").append("<div>請求成功，回傳數:"+msg+"<div>");
}

 

方法beforeSend，用於在向服務器發送請求前添加一些處理函數。這是一個ajax事件，在ajax請求開始以前就被觸發，一般容許用戶修改XMLHttpRequest對象（好比說設置附加的頭部信息），關於ajax事件的解釋可參考文檔：http://docs.jquery.com/Ajax_Events

咱們還見到一種狀況，不少網站在加載內容的過程當中給出「數據加載中，請稍候」的提示，當內容被加載完畢後顯示內容。能夠設置默認文本顯示爲加載中的提示，當內容加載完畢時，咱們能夠經過ID選擇器，將該標籤中的文本替換成最終的內容。以此來取代beforeSend，效率更高。

何時用beforeSend，何時用文本替換，取決於ajax請求先後你所展現的DOM元素是否一致，若是你所展現的DOM元素在請求以前已經存在，那麼經過上述文本替換的方式來處理會好些，若是除此之外你還需增長其餘的需求，那麼仍是用beforeSend來處理吧。