Comment migrer mon code jQuery 1.8 .live() vers la méthode jQuery 2.1 .on() ?

La migration de jQuery 1.8 .live() vers 2.1

jQuery 1.9 a introduit des changements importants dans la gestion des événements, notamment la suppression de la méthode .live(). Ce guide explique les modifications et fournit des exemples sur la façon de migrer votre code de .live() vers la nouvelle syntaxe .on().

Comprendre la suppression de .live()

jQuery 1.9 a supprimé .live() en raison de ses limitations de performances et d'efficacité. .live() lie les événements aux futurs éléments DOM, même s'ils n'existent pas encore. Cela peut entraîner des écouteurs d'événements inutiles et des problèmes de performances.

Migration vers .on()

Le remplacement recommandé pour .live() est .on( ). Cependant, il est crucial de noter que .on() a des paramètres différents.

Syntaxe originale de .live() :

.live(events, function)

Nouveau .on( ) Syntaxe :

.on(eventType, selector, function)

Exemple de migration 1 : liaison à un enfant Éléments

Avant (en utilisant .live()) :

$('#mainmenu a').live('click', function)

Après (en utilisant .on()) :

$('#mainmenu').on('click', 'a', function)

Dans cet exemple, l'élément enfant (a) est déplacé vers le .on() sélecteur.

Exemple de migration 2 : liaison aux éléments parents

Avant (en utilisant .live()) :

$('.myButton').live('click', function)

Après (en utilisant .on() :

$('#parentElement').on('click', '.myButton', function)

Dans cet exemple, l'élément .myButton est déplacé vers le sélecteur .on() et l'élément parent le plus proche (de préférence avec un ID) est utilisé. Alternativement, vous pouvez utiliser $(document) comme élément parent.

Conseils de migration supplémentaires

• Ne remplacez pas simplement .live() par . on() sans tenir compte des changements de paramètres.
• Assurez-vous que le sélecteur (enfant) est spécifié dans .on() si nécessaire.
• Définissez le sélecteur sur null s'il n'est pas requis.

Pour plus d'informations, reportez-vous à la documentation officielle de jQuery et aux guides de migration.

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!