Maison >interface Web >js tutoriel >Explication détaillée de l'utilisation et des précautions de la fonction jQuery.unbind()

Explication détaillée de l'utilisation et des précautions de la fonction jQuery.unbind()

巴扎黑
巴扎黑original
2017-06-25 15:13:412156parcourir

La fonction

unbind() est utilisée pour supprimer la fonction de gestion des événements d'un ou plusieurs événements liés à l'élément correspondant.

La fonction unbind() est principalement utilisée pour dissocier la fonction de traitement d'événements liée par la fonction bind().

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

Syntaxe

La fonction unbind() a principalement les deux formes d'utilisation suivantes :

Utilisation 1 :

jQueryObject.unbind( [ events [, handler ]] )

Supprimez le gestionnaire de fonction de gestionnaire d'événements lié à l'événement events de l'élément correspondant actuel.

Utilisation 2 :

jQueryObject.unbind( eventObject )

est l'objet Event transmis par la fonction de traitement d'événement spécifiée, qui est utilisé pour supprimer la fonction de traitement d'événement correspondante .

Paramètres

Description du paramètre

événements Facultatif/ChaîneType Un ou plusieurs types d'événements séparés par des espaces et un Espace de noms facultatif, tels que "clic", "clic focus", "keydown.myPlugin".

gestionnaire facultatif/fonction de gestion d'événements spécifiée par type de fonction.

eventObject Classe d'objet est un objet Event, utilisé pour supprimer la fonction de traitement d'événement transmise à l'objet.

jQuery 1.4.3 prend désormais en charge le gestionnaire de paramètres qui peut être faux. La fonction de gestionnaire d'événements est utilisée pour supprimer l'événement lié lorsque le paramètre du gestionnaire est faux.

Si le gestionnaire de paramètres est omis, tous les gestionnaires d'événements liés aux événements du type spécifié correspondant à l'élément sont supprimés.

Si tous les arguments sont omis, supprime tous les gestionnaires d'événements sur l'élément correspondant pour tout type d'événement lié à n'importe quel élément.

Valeur de retour

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

En fait, les paramètres de la fonction unbind() sont tous des conditions de filtre, et seuls les gestionnaires d'événements qui correspondent à toutes les conditions de paramètres seront supprimés. Plus il y a de paramètres, plus il y a de qualifications et plus la plage supprimée est petite.

Exemple et description

Veuillez vous référer au code HTML initial suivant :

<input id="btn1" type="button" value="点击1" />
<input id="btn2" type="button" value="点击2" />
<a id="a1" href="#">CodePlayer</a>

Tout d'abord, nous lions les événements au bouton ci-dessus et aux éléments 3499910bf9dac5ae3c52d5ede7383485 puis utilisez la fonction unbind() pour dissocier l'événement. Le code correspondant est le suivant :

function btnClick1(){
    alert( this.value + "-1" );
}
function btnClick2(){
    alert( this.value + "-2" );
}
var $buttons = $(":button");
// 为所有button元素的click事件绑定事件处理函数btnClick1
$buttons.bind( "click", btnClick1 );
// 为所有button元素的click事件绑定事件处理函数btnClick2
$buttons.bind( "click", btnClick2 );
// 为所有a元素的click、mouseover、mouseleave事件绑定事件处理函数
$("a").bind( "click mouseover mouseleave", function(event){
    if( event.type == "click" ){
        alert("点击事件");
    }else if( event.type == "mouseover" ){
        $(this).css("color", "red");
    }else{
        $(this).css("color", "blue");       
    }
});
// 移除为所有button元素的click事件绑定的事件处理函数btnClick2
// 点击按钮,只执行btnClick1
$buttons.unbind("click", btnClick2);
// 移除为所有button元素的click事件绑定的所有事件处理函数(btnClick1和btnClick2)
// 点击按钮,不会执行任何事件处理函数
// $buttons.unbind("click");
// 只移除为btn1元素的click事件绑定的所有事件处理函数
 // btn2元素的click事件仍然有效
// $("#btn1").unbind("click");
// 移除为所有a元素的任何事件绑定的所有处理函数
// 点击链接,或用鼠标在链接上移入、移出,都不会触发执行任何事件处理函数
// $("a").unbind( );

La fonction unbind() peut également supprimer des fonctions basées sur l'objet événement entrant. Le code jQuery suivant permet uniquement à la boîte d'invite de s'afficher lorsque le bouton [Cliquez 1] est cliqué pour la première fois, puis supprime immédiatement l'événement de clic.

var $btn1 = $("#btn1");
$btn1.bind("click", function(event){
    alert("只执行一次!");
    $(this).unbind( event ); // 移除当前事件处理函数  
});
此外,unbind()函数还可以只移除指定命名空间的事件绑定。
var $buttons = $(":button");
// 为所有button元素的click事件绑定事件处理函数
$buttons.bind( "click.foo.bar", function btnClick1(){
    alert( "click-1" );
} );
// 为所有button元素的click事件绑定事件处理函数
$buttons.bind( "click.test.bar", function btnClick1(){
    alert( "click-2" );
} );
// 移除包含命名空间foo的click事件绑定的事件处理函数
$buttons.unbind( "click.foo" ); // 移除click-1
//移除包含命名空间bar的click事件绑定的事件处理函数
// $buttons.unbind( "click.bar" ); // 移除click-1和click-2
//移除包含命名空间test的click事件绑定的事件处理函数
// $buttons.unbind( "click.test" ); // 移除click-2
// 移除所有button元素的click事件绑定的所有事件处理函数
// $buttons.unbind("click"); // 移除click-1和click-2

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!

Déclaration:
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn