Comment migrer de .live() de jQuery vers .on() pour les éléments ajoutés dynamiquement ?

Mise à jour de .live() vers .on() dans jQuery

Dans les versions 1.7 et supérieures de jQuery, la méthode .live() a a été remplacé par la méthode .on() plus polyvalente. Cependant, lors de la transition vers .on(), certaines nuances doivent être prises en compte pour garantir une gestion appropriée des événements.

Un problème courant rencontré concerne les éléments ajoutés dynamiquement. Alors que .live() attache automatiquement les gestionnaires d'événements aux éléments existants et futurs correspondant à un sélecteur donné, .on() attache uniquement les gestionnaires aux éléments déjà présents dans le DOM au moment de l'appel.

Pour obtenir un résultat similaire fonctionnalité à .live() lorsqu'il s'agit d'éléments dynamiques, il est nécessaire de lier les gestionnaires d'événements à un élément de niveau supérieur (tel que le corps du document) à l'aide de la méthode .on().

Par exemple, considérez un scénario dans lequel des listes déroulantes dynamiques sont ajoutées à une page Web et des gestionnaires d'événements doivent être attachés à ces listes déroulantes pour détecter les modifications. En utilisant .on(), le gestionnaire d'événements serait lié au corps du document comme suit :

$(document.body).on('change', 'select[name^="income_type_"]', function() {
    alert($(this).val());
});

Alternativement, il est recommandé de lier les gestionnaires d'événements aussi près que possible des éléments cibles, ce qui améliore les performances et réduit problèmes potentiels.

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!