Les différences d'utilisation entre délégué et on dans jQuery et leurs exemples

jQueryDans la version 1.7, .delegate() a été remplacé par .on() Ce qui suit est un exemple de l'utilisation et de la différence entre délégué et on dans jQuery.

Dans jQuery1.7.delegate() a été remplacé par .on(). Pour les versions antérieures, c'était toujours le moyen le plus efficace d'utiliser la délégation événement.
Dans la liaison d'événement et la délégation, délégué() et on sont généralement équivalents.

.delegate() ajoute un ou plusieurs gestionnaires d'événements à l'élément spécifié (un élément enfant de l'élément sélectionné) et spécifie les fonctions à exécuter lorsque ces événements se produisent.

Le code est le suivant :

// jQuery 1.4.3+
$( elements ).delegate( selector, events, data, handler ); // jQuery 1.7+
$( elements ).on( events, [selector], data, handler );

Par exemple : .delegate() code :

Le code est le suivant :

$("table").delegate("td","click",function(){

alert("hello");
}); 🎜>
.on() code :

Le code est le suivant :

$("table").on("click", "td", function () {

alert("hi ");

});

PS : La différence entre les deux est que l'ordre du sélecteur et des événements est différent

Les éléments enfants de. l'élément sélectionné par le délégué et sur les méthodes doit être des éléments enfants "légaux". Par exemple, le code

est le suivant :

$("table").delegate("button","click",function(){...}) ;

$ ("table").on("click", "p", function(){...});

ne fonctionne pas, car dans des circonstances normales, les sous-éléments du tableau devrait être tr, td ...

on(events,[selector],[data],fn), le paramètre [selector] est facultatif,

un sélecteur
chaîne
pour filter Descendants de l'élément sélecteur de qui a déclenché l'événement. Par exemple :

Le code est le suivant :

$("table").on("click", ".td1", function() {

alert( "hi");

});

Filtrer les sous-éléments du tableau avec la classe td1

et le sélecteur de délégué est requis.

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!