Expliquez en détail comment utiliser les trois liaisons d'événements bind/One/Live de jQuery

Cet article présente principalement les trois méthodes de liaison d'événements bind/One/Live de jQuery. Les amis dans le besoin peuvent venir s'y référer. J'espère que cela sera utile à tout le monde

. jQuery est un excellent framework JavaScript. Dans l'ancienne version, il utilise principalement la méthode bind(). Dans la nouvelle version, il existe deux autres méthodes, One() et Live(). ci-dessous. Utilisation :

1. lier/délier
Dans le modèle d'événement jquery, il existe deux fonctions de liaison d'événement de base, lier et dissocier, la signification. L'une de ces deux fonctions consiste à faire correspondre les éléments de la page et les événements liés au processus. Par exemple, des événements tels que onfocus, onblur, onmouseover et onmousedown que nous utilisons souvent dans JS peuvent être transmis comme paramètres de liaison.

$("#id").bind('click',function(){alert('tt!')});

où bind's La signification d'un paramètre est : type d'événement (notez qu'il n'est pas nécessaire d'en rajouter), le code dans la fonction est le code logique que vous souhaitez exécuter
Liaison d'événements multiples : bind vous permet également de lier plusieurs événements, noms d'événements Séparez-les par des espaces, par exemple :

$('a').bind('click mouseover',function(){

Dans le dernier jquery1. Dans version 4, la méthode bind a été améliorée. Vous pouvez passer un objet de type JSON dans la méthode bind pour lier plusieurs fonctions de traitement d'événements à la fois a').bind({

cliquez : function(){alert('a');},

mouseover:function(){alert('a Again!')}

Dans la fonction function, vous pouvez transmettez également un objet javaScript à la méthode fonction. Cet objet événement peut généralement être omis

Il existe également un paramètre data dans bind, qui est rarement utilisé , généralement pour résoudre le problème du traitement de la même variable. même méthode

var productname="Sports Shoes";

$('#Area').bind( 'click',function(){

alert(productname);});


productname="necklace",

$('#Area') .bind('click',function(){

alert(productname) ;});


Puisque la variable productname est réaffectée, les messages de sortie sont "collier", si vous ne comprenez pas ici, vous pouvez vérifier la portée variable de JavaScript . Pour résoudre ce problème, vous devez utiliser le paramètre data,

var productname="Sports Shoes";

$ ('#Area').bind('click',{pn: productname},function(){

alert(event.data.pn);});
productname="necklace",
$('#Area').bind('click' ,{pn:productname},function(){
alert(event.data.pn);
});

2.
Liez un gestionnaire d'événements unique pour chaque événement spécifique (comme un clic) de l'élément correspondant. Cette méthode a les mêmes paramètres que la méthode bind. La différence avec la méthode bind est que le traitement événementiel de l'élément correspondant n'est exécuté qu'une seule fois. Après l'exécution, il ne sera plus jamais exécuté. la requête Web est réinitialisée.
$('a').one('click',function(){

alert('a');

})

Après avoir cliqué sur l'élément a sur la page, un message apparaît. À moins que l'utilisateur lance une deuxième demande, cliquer à nouveau sur l'élément a ne fera pas apparaître la boîte de dialogue de message.

3. live
Cette méthode peut principalement gérer les éléments ajoutés dynamiquement, et également lier des événements à ces éléments ajoutés ultérieurement.
$('a').live('click,function(){

alert('show message!');

})

Ensuite, si j'ajoute un élément,

$('body').appnend('Another Element');

alors cet élément sera également déclenché par la gestion des événements alerte de fonction. De plus, jQuery propose également des moyens simples de lier ces types d'événements standard, tels que .click() pour simplifier .bind('click').

Il existe un total des noms d'événements suivants : flou, focus, focusin, focusout, chargement, redimensionnement, défilement, déchargement, clic, dblclick, mousedown, mouseup, mousemove, mouseover, mouseout, mouseenter , mouseleave, modifier, sélectionner, soumettre, appuyer sur une touche, appuyer sur une touche, appuyer sur une touche, erreur, etc.

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!