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

來源:互聯網
上載者:User

常見的一種效果,在用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("<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來處理吧。

相關文章

聯繫我們

該頁面正文內容均來源於網絡整理,並不代表阿里雲官方的觀點,該頁面所提到的產品和服務也與阿里云無關,如果該頁面內容對您造成了困擾,歡迎寫郵件給我們,收到郵件我們將在5個工作日內處理。

如果您發現本社區中有涉嫌抄襲的內容,歡迎發送郵件至: info-contact@alibabacloud.com 進行舉報並提供相關證據,工作人員會在 5 個工作天內聯絡您,一經查實,本站將立刻刪除涉嫌侵權內容。

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.