jQuery 1.7 .on () vs .live () revue

jQuery's .on() et .off() Méthodes: un guide complet

Cet article explore les gestionnaires d'événements de jQuery .on() et .off(), en les comparant à la méthode désormais déprimée .live(). La recommandation d'Adam Sontag lors du Sommet JQuery de 2011 pour adopter .on() et .off() a mis en évidence des améliorations significatives. Plongeons dans les fonctionnalités et les différences.

jQuery .live() (déprécié)

La méthode .live(), une fois louée pour sa capacité à attacher des gestionnaires d'événements à des éléments DOM ajoutés dynamiquement, n'est plus recommandé. Ses limitations incluent:

1. Performance: récupérer les éléments avant d'appliquer .live() est inefficace, en particulier avec de grands documents.
2. CHAMING: Méthode Le voilier n'est pas pris en charge (par exemple, $("a").find(".offsite, .external").live(...) est invalide).
3. Propagation des événements: Les événements parcourent le chemin le plus long possible, conduisant à une manipulation plus lente. event.stopPropagation() est inefficace pour empêcher les gestionnaires de niveau inférieur de tirer.
4. unbind() Interaction: $(document).unbind("click") supprime tous cliquez sur les gestionnaires connectés via .live(), provoquant potentiellement un comportement inattendu.

jQuery .on()

.on() attache les gestionnaires d'événements à des éléments sélectionnés, gérant les éléments existants et futurs.

Différences de clés: .live() vs .on()

• Fonctionnalité: .live() attache des événements au niveau document, tandis que .on() permet une délégation d'événements plus précise à un élément d'ancêtre spécifié.
• Utilisation: La différence de base réside dans l'ordre des paramètres et l'absence d'un paramètre de sélecteur dans .live():

$(selector).live(events, data, handler);                // jQuery 1.3+ (Deprecated)
$(document).delegate(selector, events, data, handler);  // jQuery 1.4.3+ (Deprecated)
$(document).on(events, selector, data, handler);        // jQuery 1.7+

• Performance: .on() surpasse significativement .live(), souvent par un facteur de 3 ou 4, comme le démontre diverses références de performance.

jQuery .off()

.off() supprime les gestionnaires d'événements, fournissant une contrepartie à .on(). Il fonctionne de manière similaire à .unbind(), en maintenant une compatibilité arrière. Dans jQuery 1.7 et plus tard, .unbind() est essentiellement un alias pour .off().

.bind() et .on()

dans jQuery 1.7 et plus tard, .bind() est un alias pour .on().

Migration de .live() vers .on()

Remplacer $(selector).live(event, data, function) par $(document).on(event, selector, data, function). Notez l'ordre des paramètres modifiés.

Questions fréquemment posées (FAQ)

La section FAQ fournie dans le texte d'origine est déjà complète et aborde les principales différences, les stratégies de migration et les considérations de performance liées à .live() et .on(). Il n'est pas nécessaire de le reproduire ici.

Conclusion

Le passage de .live() vers .on() et .off() est une mise à niveau cruciale dans la manipulation des événements jQuery. .on() offre des performances, une flexibilité et une maintenabilité supérieures, ce qui en fait le choix préféré pour le développement moderne de jQuery.

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!