首頁 > web前端 > js教程 > 詳細介紹jQuery.ajaxSend()函數的使用

詳細介紹jQuery.ajaxSend()函數的使用

巴扎黑
發布: 2017-07-03 10:49:57
原創
1426 人瀏覽過

ajaxSend()函數用來設定當AJAX請求即將被傳送時執行的回呼函數

這是一個全域AJAX事件函數,用於為任何AJAX請求的ajaxSend事件綁定事件處理函數。當AJAX請求即將被傳送時,將觸發ajaxSend事件,並執行綁定的事件處理函數。

該函數必須在jQuery物件實例上調用,ajaxSend()將為每個匹配元素的ajaxSend事件綁定處理函數。當AJAX請求即將被傳送完成後,所有符合元素上的處理函數都會被觸發執行。事件處理函數內的this將指向目前DOM元素。

你可以在同一元素中多次呼叫該函數,從而綁定多個事件處理函數。觸發ajaxSend事件時,jQuery會依照綁定的先後順序依序執行綁定的事件處理函數。

從jQuery 1.8開始,函數只能為document物件的ajaxSend事件綁定處理函數,為其他元素綁定的事件處理函數不會運作。

如果在jQuery.ajax()或jQuery.ajaxSetup()中將選項參數global設為false,可以禁止該AJAX請求觸發全域的AJAX事件。

此函數屬於jQuery物件(實例)。

語法

jQuery 1.0 新增此函數。

jQueryObject.ajaxSend( handler )

參數

參數 說明

handler Function類型觸發事件時,需要執行的事件處理函數。

回呼函數handler有3個參數:其一是表示當前事件的Event對象,其二是發送當前AJAX請求的jqXHR對象,其三是包含為本次AJAX請求設置的所有參數選項(包括無需指定的預設參數選項)的Object物件

jqXHR物件就是經過jQuery封裝的XMLHttpRequest物件(保留了其大多數屬性和方法)。

傳回值

ajaxSend()函數的回傳值為jQuery類型,傳回目前jQuery物件本身。

範例&說明

請參考以下HTML範例程式碼:

CodePlayer

#< ;div id="content2">專注於程式開發技術分享

#

http://www.365mini.com

以下是與ajaxSend()函數相關的jQuery範例程式碼,以示範ajaxSend()函數的具體用法:

以下程式碼請基於1.8之前版本的jQuery來執行(請注意,透過ajaxSend()設定的全域事件處理函數與透過$.ajax()的beforeSend選項所設定的局部事件處理函數,它們的參數是不同的)。

//当前 jQuery版本:1.7.2 (必须是1.8之前的版本)
$("div").ajaxSend( function(event, jqXHR, options){
    alert("处理函数1: 当前元素的id为" + this.id + ",请求的url为" + options.url);
} );
$("div").ajaxSend( function(event, jqXHR, options){
    alert("处理函数2:请求方式为" + options.type);
} );
// 执行该AJAX请求,会弹出6次对话框
// 因为当前页面有3个div元素,我们为每个div元素绑定了2个事件处理函数
$.ajax( {
    url: "index.html"
} );
// 执行该AJAX请求,会弹出7次对话框
// 因为当前页面有3个div元素,我们为每个div元素绑定了2个事件处理函数
// 此外$.ajax()自己通过beforeSend选项绑定了一个局部的ajaxSend事件处理函数,它会执行一次
// 因此总共弹出7次对话框
$.ajax( {
    url: "myurl" ,
    beforeSend: function(jqXHR, options){
       alert( "即将开始发送!" );
       // return false; // 如果返回false,可以取消本次请求
    }
} );
登入後複製

如果目前jQuery為1.8以上版本,上述jQuery程式碼總共只會跳出對話方塊一次。因為從jQuery 1.8開始,ajaxSend事件的處理函數必須綁定到document物件上才能生效。

因此,不論當前jQuery為何版本,如果不是特殊需求,我們都應該將ajaxSend事件的處理函數綁定到document物件上。

$(document).ajaxSend( function(event, jqXHR, options){
    alert("处理函数1: 当前元素的id为" + this.id + ",请求的url为" + options.url);
} );
$(document).ajaxSend( function(event, jqXHR, options){
    alert("处理函数2:请求方式为" + options.type);
} );
// 执行该AJAX请求,会弹出2次对话框
// 因为document对象上绑定了2个事件处理函数
$.ajax( {
    url: "index.html"
} );
// 执行该AJAX请求,会弹出3次对话框
// 因为$.ajax()自己通过beforeSend选项绑定了一个局部的ajaxSend事件处理函数,它会执行一次
// 我们还通过ajaxSend()额外绑定了两个事件处理函数,会再弹出2次
$.ajax( {
    url: "myurl" ,
    // global: false , // 可以禁止触发全局的Ajax事件
    beforeSend: function(jqXHR, options){
        alert( "即将开始发送!" );
        // return false; // 如果返回false,可以取消本次请求
    }
} );
登入後複製

以上是詳細介紹jQuery.ajaxSend()函數的使用的詳細內容。更多資訊請關注PHP中文網其他相關文章!

相關標籤:
來源:php.cn
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
熱門推薦
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板