首頁 >web前端 >js教程 >如何實現jquery中ajax請求的用法詳解

如何實現jquery中ajax請求的用法詳解

伊谢尔伦
伊谢尔伦原創
2017-06-19 09:38:081538瀏覽

Ajax請求

jQuery.ajax(options)

透過 HTTP 請求載入遠端資料。 jQuery 底層 AJAX 實作。簡單易用的高層實作見 .get,.post 等。

.ajax()傳回其建立的XMLHttpRequest物件。大多數情況下你無需直接操作該對象,但特殊情況下可用於手動終止請求。 .ajax() 只有一個參數:參數 key/value 對象,包含各配置及回呼函數資訊。詳細參數選項請見下。

注意: 如果你指定了 dataType 選項,請確保伺服器傳回正確的 MIME 訊息,(如 xml 返回 "text/xml")。錯誤的 MIME 類型可能導致不可預測的錯誤。

注意:如果dataType設定為"script",那麼在遠端請求時(不在同一個網域下),所有POST請求都會轉為GET請求。 (因為將使用DOM的script標籤來載入)

jQuery 1.2 中,您可以跨網域載入 JSON 數據,使用時需將資料類型設定為 JSONP。使用 JSONP 形式呼叫函數時,如 "myurl?callback=?" jQuery 會自動取代 ? 為正確的函式名,以執行回呼函數。當資料類型設定為 "jsonp" 時,jQuery 會自動呼叫回呼函數。

傳回值 XMLHttpRequest

參數

options (可選) : AJAX 請求設定。所有選項都是可選的。

選項

(1)、async (Boolean) : (預設: true) 
預設設定下,所有請求均為非同步請求。如果需要傳送同步請求,請將此選項設為 false。注意,同步請求將鎖住瀏覽器,使用者其它操作必須等待請求完成才可以執行。

(2)beforeSend (Function) : 發送請求前可修改 XMLHttpRequest 物件的函數,例如新增自訂 HTTP 頭。
XMLHttpRequest 物件是唯一的參數。這是一個 Ajax 事件。如果回傳false可以取消本次ajax請求。

(3)、cache (Boolean) : (預設: true,dataType為script時預設為false) 
jQuery 1.2 新功能,設定為false 將不會從瀏覽器快取載入請求訊息

(4)、complete (Function) : 請求完成後回呼函數 (請求成功或失敗時均呼叫)。
參數: XMLHttpRequest 物件和一個描述成功請求類型的字串。 這是一個 Ajax 事件

(5)、contentType (String) : (預設: "application/x-www-form-urlencoded") 傳送訊息到伺服器時內容編碼類型。預設值適合大多數應用程式場合。

(6)、data (Object,String) : 傳送到伺服器的資料。將自動轉換為請求字串格式。 GET 請求中將附加在URL 後。查看processData選項說明以禁止此自動轉換。
必須為 Key/Value 格式。如果為數組,jQuery 將自動為不同值對應同一個名稱。如 {foo:["bar1", "bar2"]} 轉換為 '&foo=bar1&foo=bar2'。

(7)、dataFilter (Function) :給Ajax傳回的原始資料的進行預處理的函數。提供data和type兩個參數:data是Ajax傳回的原始數據,type是呼叫jQuery.ajax時提供的dataType參數。函數傳回的值將由jQuery進一步處理。

(8)、dataType (String) : (預設值:智慧型判斷xml或html)
預期伺服器傳回的資料類型。如果不指定,jQuery 將自動根據HTTP 包MIME 資訊返回responseXML 或responseText,並作為回調函數參數傳遞,可用值:

"xml": 返回XML 文檔,可用jQuery 處理。
"html": 傳回純文字 HTML 資訊;所包含的script標籤會在插入dom時執行。
"script": 傳回純文字 JavaScript 程式碼。不會自動快取結果。除非設定了"cache"參數。注意:在遠端請求時(不在同一個網域下),所有POST請求都會轉為GET請求。 (因為將使用DOM的script標籤來載入)
"json": 傳回 JSON 資料 。
"jsonp": JSONP 格式。使用 JSONP 形式呼叫函數時,如 "myurl?callback=?" jQuery 會自動取代 ? 為正確的函式名,以執行回呼函數。
"text": 傳回純文字字串

(9)、error (Function) : (預設: 自動判斷 (xml 或 html)) 請求失敗時呼叫時間。參數有以下三個:XMLHttpRequest 物件、錯誤訊息、(可選)擷取的錯誤物件。如果發生了錯誤,錯誤訊息(第二個參數)除了得到null之外,還可能是"timeout", "error", "notmodified" 和 "parsererror"。 Ajax 事件。

(10)、global (Boolean) : (預設: true) 是否觸發全域 AJAX 事件。設定為 false 將不會觸發全域 AJAX 事件,如 ajaxStart 或 ajaxStop 可用於控制不同的 Ajax 事件。

(11)、ifModified (Boolean) : (預設: false) 僅在伺服器資料改變時取得新資料。使用 HTTP 套件 Last-Modified 頭資訊判斷。

(12)、jsonp (String) : 在一個jsonp請求中重寫回呼函數的名字。這個值用來取代在"callback=?"這種GET或POST請求中URL參數裡的"callback"部分,例如{jsonp:'onJsonPLoad'}會導致將"onJsonPLoad=?"傳給伺服器。

(13)、password (String) : 用於回應HTTP存取認證請求的密碼

(14)、processData (Boolean) : (預設: true) 預設情況下,發送的資料將被轉換為物件(技術上講並非字串) 以配合預設內容類型"application/x-www-form-urlencoded"。如果要傳送 DOM 樹資訊或其它不希望轉換的訊息,請設定為 false。

(15)、scriptCharset (String) : 只有當請求時dataType為"jsonp"或"script",且type是"GET"才會用於強制修改charset。通常在本地和遠端的內容編碼不同時使用。

(16)、success (Function) : 請求成功後的回呼函數。參數:由伺服器傳回,並根據dataType參數進行處理後的資料;描述狀態的字串。 Ajax 事件。

(17)、timeout (Number) : 設定請求逾時時間(毫秒)。此設定將覆蓋全域設定。

(18)、type (String) : (預設: "GET") 要求方式 ("POST" 或 "GET"), 預設為 "GET"。注意:其它 HTTP 請求方法,如 PUT 和 DELETE 也可以使用,但僅部分瀏覽器支援。

(19)、url (String) : (預設: 目前頁位址) 傳送請求的位址。

(20)、username (String) : 用於回應HTTP存取認證請求的使用者名稱

(21)、xhr (Function) : 需要傳回一個XMLHttpRequest 物件。預設在IE下是ActiveXObject 而其他情況下是XMLHttpRequest 。用於重寫或提供一個增強的XMLHttpRequest 物件。這個參數在jQuery 1.3以前不可用。

使用jQuery.ajax()方法取得數據,程式碼如下:

$.ajax({
 url: "http://www.php.cn", //请求的url地址
 dataType: "json", //返回格式为json
 async: true, //请求是否异步,默认为异步,这也是ajax重要特性
 data: { "id": "value" }, //参数值
 type: "GET", //请求方式
 beforeSend: function() {
  //请求前的处理
 },
 success: function(req) {
  //请求成功时处理
 },
 complete: function() {
  //请求完成的处理
 },
 error: function() {
  //请求出错处理
 }
});

以上是如何實現jquery中ajax請求的用法詳解的詳細內容。更多資訊請關注PHP中文網其他相關文章!

陳述:
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn