Explication détaillée de l'utilisation de la fonction jQuery.ajaxComplete()

La fonction

ajaxComplete() est utilisée pour définir la fonction de rappel à exécuter lorsque la requête AJAX est terminée (qu'elle soit réussie ou échouée).

Il s'agit d'une fonction d'événement AJAX globale, utilisée pour lier la fonction de traitement d'événement à l'événement ajaxComplete de toutes les requêtes AJAX. Lorsque la requête AJAX est terminée (qu'elle ait réussi ou échoué), l'événement ajaxComplete sera déclenché et le gestionnaire d'événements lié sera exécuté.

Cette fonction doit être appelée sur l'instance d'objet jQuery, et ajaxComplete() liera une fonction de gestionnaire à l'événement ajaxComplete de chaque élément correspondant. Lorsque la requête AJAX est terminée, les fonctions de traitement sur tous les éléments correspondants seront déclenchées et exécutées. Ceci dans le gestionnaire d'événements pointera vers l'élément DOM actuel.

Vous pouvez appeler cette fonction plusieurs fois sur le même élément pour lier plusieurs gestionnaires d'événements. Lorsque l'événement ajaxComplete est déclenché, jQuery exécutera les fonctions de traitement des événements liés dans l'ordre de liaison.

À partir de jQuery 1.8, cette fonction ne peut lier les gestionnaires qu'à l'événement ajaxComplete de l'objet document. Les gestionnaires d'événements liés à d'autres éléments ne fonctionneront pas.

Si vous définissez le paramètre d'option global sur false dans jQuery.ajax() ou jQuery.ajaxSetup(), vous pouvez empêcher la requête AJAX de déclencher des événements AJAX globaux.

Cette fonction appartient à l'objet (instance) jQuery.

Syntaxe

Cette fonction est nouvelle dans jQuery 1.0.

jQueryObject.ajaxComplete( handler )

Parameter

Description du paramètre

handler Le type de fonction doit être exécuté lorsque cet événement est une fonction de gestion des événements déclenchée.

Le gestionnaire de fonction de rappel a 3 paramètres : l'un est l'objet Event représentant l'événement en cours, l'autre est l'objet jqXHR qui envoie la requête AJAX actuelle, et le troisième correspond à toutes les options de paramètres définies pour cette requête AJAX ( Objet objet incluant les options de paramètres par défaut qui n'ont pas besoin d'être spécifiées).

L'objet jqXHR est un objet de type XMLHttpRequest encapsulé par jQuery.

Valeur de retour

ajaxComplete()La valeur de retour de la fonction est de type jQuery et renvoie l'objet jQuery actuel lui-même.

Exemple et description

Veuillez vous référer à l'exemple de code HTML suivant :

<div id="content1">CodePlayer</div>
<div id="content2">专注于编程开发技术分享</div>
<div id="content3">http://www.365mini.com</div>

Ce qui suit est l'exemple de code jQuery lié à la fonction ajaxComplete() pour démontrer le Fonction ajaxComplete() Utilisation spécifique :

Veuillez exécuter le code suivant basé sur les versions de jQuery antérieures à 1.8 (veuillez noter que la fonction de traitement des événements définie via ajaxComplete() et la fonction de rappel définie via l'option complète de $.ajax (), leurs paramètres sont différents).

// 当前 jQuery版本：1.7.2 (必须是1.8之前的版本)
$("div").ajaxComplete( function(event, jqXHR, options){
    alert("处理函数1： 当前元素的id为" + this.id + "，请求的url为" + options.url);
} );
$("div").ajaxComplete( function(event, jqXHR, options){
    alert("处理函数2：请求方式为" + options.type);
} );
// 执行该AJAX请求，会弹出6次对话框
// 因为当前页面有3个div元素，我们为每个div元素绑定了2个事件处理函数
$.ajax( {
    url: "index.html"
} );
// 执行该AJAX请求，会弹出7次对话框
// 因为$.ajax()自己通过complete选项绑定了一个ajaxComplete事件处理函数，这个事件处理函数是绑定在document上的，document只有一个，因此只执行一次
// 当前页面还有3个div元素，我们为每个div元素绑定了2个事件处理函数
// 因此总共弹出7次对话框
$.ajax( {
    url: "myurl" ,
    complete: function(jqXHR, textStatus){
        // jqXHR 是经过jQuery封装的XMLHttpRequest对象
        // textStatus 可能为：null、'success'、 'notmodified'、 'error'、 'timeout'、 'abort'或'parsererror'等
        
       alert( "ajax()" );
    }
} );

Si le jQuery actuel est la version 1.8 ou supérieure, le code jQuery ci-dessus n'apparaîtra dans la boîte de dialogue qu'une seule fois au total. Car à partir de jQuery 1.8, la fonction de gestionnaire de l'événement ajaxComplete doit être liée à l'objet document pour prendre effet.

Par conséquent, quelle que soit la version actuelle de jQuery, s'il n'y a pas de besoins particuliers, nous devons lier la fonction de gestionnaire de l'événement ajaxComplete à l'objet document.

$(document).ajaxComplete( function(event, jqXHR, options){
    alert("处理函数1：请求的url为" + options.url);
} );
$(document).ajaxComplete( function(event, jqXHR, options){
    alert("处理函数2：请求方式为" + options.type);
} );
// 执行该AJAX请求，会弹出2次对话框
// 因为document对象上绑定了2个事件处理函数
$.ajax( {
    url: "index.html"
//  , global: false // 可以禁止触发全局的Ajax事件
} );
// 执行该AJAX请求，会弹出3次对话框
// 因为$.ajax()自己通过complete选项绑定了一个局部的ajaxComplete事件处理函数，它也在document对象上，会执行一次
// 我们还通过ajaxComplete()额外绑定了两个事件处理函数，会再弹出2次
$.ajax( {
    url: "myurl" ,
    complete: function(jqXHR, textStatus){
        // jqXHR 是经过jQuery封装的XMLHttpRequest对象
        // textStatus 可能为：null、'success'、 'notmodified'、 'error'、 'timeout'、 'abort'或'parsererror'等
       alert( "ajax()" );
    }
//  , global: false // 可以禁止触发全局的Ajax事件
} );

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!