$ .ajax()方法執(zhí)行異步HTTP(Ajax)請(qǐng)求。
$ .ajax()方法是jQuery發(fā)送的所有Ajax請(qǐng)求的基礎(chǔ)。通常不需要直接調(diào)用此方法,因?yàn)榭梢允褂?a href="ajax_get.html">$ .get(),$ .post()和load()等幾個(gè)更高級(jí)的代替方法,并且更易于使用。但是,如果需要較少的常用選項(xiàng),則$ .ajax()可以更靈活地使用。
語法一:1.5+版本:
$.ajax(url, {name:value, name:value, ...})
語法二 :1.0+版本:
$.ajax({name:value, name:value, ...})
使用添加的AJAX請(qǐng)求版本更改DIV元素的文本:1.5版本:
$.ajax("ajax_intro.txt", {success: function(response){ $("div").html(response); });測試看看?/?
使用添加的AJAX請(qǐng)求版本更改DIV元素的文本:1.0版本:
$.ajax({ url: "ajax_intro.txt", success: function(response){ $("div").html(response); } });測試看看?/?
請(qǐng)求ajax_get.php頁面,并發(fā)送一些其他數(shù)據(jù):
$.ajax({ url: "ajax_get.php", data: {fname:"Seagull", lname:"Anna"}, success: function(response){ $("div").html(response); } });測試看看?/?
請(qǐng)求ajax_get.php頁面,發(fā)送一些其他數(shù)據(jù),并發(fā)出警報(bào)狀態(tài)消息:
$.ajax({ url: "ajax_get.php", data: {fname:"Seagull", lname:"Anna"}, success: function(response, status){ $("div").html(response); alert(status); } });測試看看?/?
使用HTTP POST方法請(qǐng)求ajax_post.php頁面:
$.ajax({ url: "ajax_post.php", method: "POST", success: function(response){ $("div").html(response); } });測試看看?/?
使用異步設(shè)置來指定同步請(qǐng)求:
$.ajax({ url: "ajax_get.php", async: false, data: {fname:"Seagull", lname:"Anna"}, success: function(response){ $("div").html(response); } });測試看看?/?
使用dataType設(shè)置為請(qǐng)求指定數(shù)據(jù)類型:
$.ajax({ url: "/javascript/myscript.js", dataType: "script" });測試看看?/?
如果Ajax請(qǐng)求遇到錯(cuò)誤,則顯示通知:
$.ajax({ url: "wrong_file.html", success: function(response){ $("div").html(response); }, error: function(xhr){ $("div").html("發(fā)生錯(cuò)誤: " + xhr.status + " " + xhr.statusText); } });測試看看?/?
請(qǐng)求文件,并在完成后通知用戶。如果請(qǐng)求失敗,則顯示一條通知:
let request = $.ajax({ url: "ajax_get.php", data: {fname:"Seagull", lname:"Anna"} }); request.done(function(msg){ $("div").html(msg); }); request.fail(function(xhr, textStatus){ $("div").html("Request failed: " + textStatus); });測試看看?/?
參數(shù)為AJAX請(qǐng)求指定一個(gè)或多個(gè)name:value對(duì)。
可能的名稱:下表中的值:
名稱 | 值類型 | 描述 |
---|---|---|
async | 布爾型 | 一個(gè)布爾值,指示是否應(yīng)異步處理請(qǐng)求。默認(rèn)為true |
beforeSend(xhr) | 函數(shù) | 發(fā)送請(qǐng)求之前運(yùn)行的函數(shù) |
cache | 布爾型 | 一個(gè)布爾值,指示瀏覽器是否應(yīng)緩存請(qǐng)求的頁面。默認(rèn)為true |
complete(xhr,status) | 函數(shù) | 請(qǐng)求完成后要運(yùn)行的函數(shù)(成功和錯(cuò)誤功能之后) |
contentType | 布爾值或字符串 | 將數(shù)據(jù)發(fā)送到服務(wù)器時(shí)使用的內(nèi)容類型。默認(rèn)值為:“ application / x-www-form-urlencoded” |
context | 普通對(duì)象 | 為所有與AJAX相關(guān)的回調(diào)函數(shù)指定“ this”值 |
data | PlainObject或String或Array | 指定要發(fā)送到服務(wù)器的數(shù)據(jù) |
dataFilter(data,type) | 函數(shù) | 用于處理XMLHttpRequest的原始響應(yīng)數(shù)據(jù)的函數(shù) |
dataType | 字符串 | 服務(wù)器響應(yīng)預(yù)期的數(shù)據(jù)類型 |
error(xhr,status,error) | 函數(shù) | 請(qǐng)求失敗時(shí)運(yùn)行的函數(shù) |
global | 布爾型 | 一個(gè)布爾值,指定是否觸發(fā)請(qǐng)求的全局AJAX事件句柄。默認(rèn)為true |
ifModified | 布爾型 | 一個(gè)布爾值,指定是否只有在自上一個(gè)請(qǐng)求以來響應(yīng)已更改的情況下,請(qǐng)求才成功。默認(rèn)值為:false。 |
jsonp | 字符串或布爾 | 覆蓋jsonp請(qǐng)求中的回調(diào)函數(shù) |
jsonpCallback | 函數(shù) | 為jsonp請(qǐng)求中的回調(diào)函數(shù)指定名稱 |
method | 字符串 | 指定用于請(qǐng)求的HTTP方法。(獲取或發(fā)布)。默認(rèn)為GET |
password | 字符串 | 指定在HTTP訪問認(rèn)證請(qǐng)求中使用的密碼 |
processData | 布爾型 | 一個(gè)布爾值,指定是否應(yīng)將與請(qǐng)求一起發(fā)送的數(shù)據(jù)轉(zhuǎn)換為查詢字符串。默認(rèn)為true |
scriptCharset | 字符串 | 指定請(qǐng)求的字符集 |
statusCode | 普通對(duì)象 | 響應(yīng)具有相應(yīng)代碼時(shí)將調(diào)用數(shù)字HTTP代碼和函數(shù)的對(duì)象$ .ajax({ statusCode:{ 404:function(){ alert(“找不到頁面”); } } }); |
success(response,status,xhr) | 函數(shù) | 請(qǐng)求成功時(shí)要運(yùn)行的函數(shù) |
timeout | 數(shù)字 | 請(qǐng)求的本地超時(shí)(以毫秒為單位) |
traditional | 布爾型 | 一個(gè)布爾值,指定是否使用傳統(tǒng)的參數(shù)序列化樣式 |
type | 字符串 | method的別名。如果您使用的是1.9.0之前的jQuery版本,則應(yīng)使用type |
url | 字符串 | 指定將請(qǐng)求發(fā)送到的URL。默認(rèn)為當(dāng)前頁面 |
username | 字符串 | 指定要在HTTP訪問認(rèn)證請(qǐng)求中使用的用戶名 |
xhr | 函數(shù) | 用于創(chuàng)建XMLHttpRequest對(duì)象的函數(shù) |