我們可以把AJAX全局函數附加到特定的DOM元素。這些函數在AJAX請求處理的不同階段或在請求最終成功或失敗時將被觸發
AJAX全局函數的任何一個命令語法都是一致的，所以統一在下表中說明。
| ajaxStart(callback) ajaxSend(callback) ajaxSuccess(callback) ajaxError(callback) ajaxComplete(callback) ajaxStop(callback) |
|
| 把傳入的回調函數附加到所有匹配元素上，一旦到達AJAX請求處理的指定時刻就觸發回調函數。 |
|
| 參數 |
|
| callback |
(函數)將被附加的回調函數。參照下表了解何時回調函數被觸發以及什么參數將被傳遞。 |
| 返回值 |
包裝集 |
AJAX全局回調函數(按觸發順序排列)
| 全局函數類型 |
何時被觸發 |
參數 |
| ajaxStart |
在jQuery AJAX函數或命令發起時，但在XHR實例被創建之前 |
類型被設置為ajaxStart的全局回調信息對象 |
| ajaxSend |
在XHR實例被創建之后，但在XHR實例被發送給服務器之前 |
類型被設置為ajaxSend的全局回調信息對象；XHR實例；$.ajax()函數使用的屬性 |
| ajaxSuccess |
在請求已從服務器返回之后，並且響應包含成功狀態碼 |
類型被設置為ajaxSuccess的全局回調信息對象；XHR實例；$.ajax()函數使用的屬性 |
| ajaxError |
在請求已從服務器返回之后，並且響應包含失敗狀態碼 |
類型被設置為ajaxError的全局回調信息對象；XHR實例；$.ajax()函數使用的屬性；被XHR實例返回的異常對象(如果有的話) |
| ajaxComplete |
在請求已從服務器返回之后，並且在任何已聲名的ajaxSuccess或ajaxError回調函數已被調用之后 |
類型被設置為ajaxComplete的全局回調信息對象；XHR實例；$.ajax()函數使用的屬性 |
| ajaxStop |
在所有其他AJAX處理完成以及任何其他適用的全局回調函數已被調用之后 |
類型被設置為ajaxStop的全局回調信息對象 |
看個例子
客戶端代碼：
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
<script src="Scripts/jquery-1.4.1.min.js" type="text/javascript"></script>
<script type="text/javascript">
$().ready(function () {
$('#selectNum').change(function () {
var idValue = $(this).val();
$('#show').html('');
//這里可以把url地址改成一個錯誤地址如Server1.aspx測試錯誤情況?
$.post('Server1.aspx', { id: idValue }, function (data) { $('#show').html('success callback!<br/>' + data + '<br/>' + (new Date()).toLocaleTimeString() + ' ' + (new Date()).getMilliseconds())+'<br/>' })
});
$('#ajaxStart').ajaxStart(function () {
$(this).html('ajaxStart!<br/>'
+ (new Date()).toLocaleTimeString() + ' ' + (new Date()).getMilliseconds())
})
$('#ajaxSend').ajaxSend(function (o, xhr, property) {
$(this).html('ajaxSend!<br/>'
+ (new Date()).toLocaleTimeString() + ' ' + (new Date()).getMilliseconds())
})
$('#ajaxSuccess').ajaxSuccess(function (o, xhr, property) {
$(this).html('ajaxSuccess!<br/>'
+ 'status:' + xhr.status + ' status info:' + xhr.statusText + '<br/>'
+ (new Date()).toLocaleTimeString() + ' ' + (new Date()).getMilliseconds())
})
$('#ajaxError').ajaxError(function (o, xhr, property, err) {
$(this).html('ajaxError!<br/>'
+ 'status:' + xhr.status + ' status info:' + xhr.statusText + '<br/>'
+ (new Date()).toLocaleTimeString() + ' ' + (new Date()).getMilliseconds())
})
$('#ajaxComplete').ajaxComplete(function (o, xhr, property) {
$(this).html('ajaxComplete!<br/>'
+ 'status:' + xhr.status + ' status info:' + xhr.statusText + '<br/>'
+ (new Date()).toLocaleTimeString() + ' ' + (new Date()).getMilliseconds())
})
$('#ajaxStop').ajaxStop(function () {
$(this).html('ajaxStop!<br/>'
+ (new Date()).toLocaleTimeString() + ' ' + (new Date()).getMilliseconds())
})
})
</script>
</head>
<body>
<select id="selectNum">
<option value="0">--Select--</option>
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
</select>
<div id="show"></div>
<fieldset>
<legend>ajaxStart</legend>
<div id="ajaxStart"></div>
</fieldset>
<fieldset>
<legend>ajaxSend</legend>
<div id="ajaxSend"></div>
</fieldset>
<fieldset>
<legend>ajaxSuccess</legend>
<div id="ajaxSuccess"></div>
</fieldset>
<fieldset>
<legend>ajaxError</legend>
<div id="ajaxError"></div>
</fieldset>
<fieldset>
<legend>ajaxComplete</legend>
<div id="ajaxComplete"></div>
</fieldset>
<fieldset>
<legend>ajaxStop</legend>
<div id="ajaxStop"></div>
</fieldset>
</body>
</html>
服務端主要代碼：
protected void Page_Load(object sender, EventArgs e)
{
if (!Page.IsPostBack)
{
if (Request["id"] != null && !string.IsNullOrEmpty(Request["id"].ToString()))
{
Response.Write(GetData(Request["id"].ToString()));
}
}
}
protected string GetData(string id)
{
string str = string.Empty;
switch (id)
{
case "1":
str += "This is Number 1";
break;
case "2":
str += "This is Number 2";
break;
case "3":
str += "This is Number 3";
break;
default:
str += "Warning Other Number!";
break;
}
return str;
}
運行程序，結果如圖：
我們也證實了全局函數的執行順序。