Pourquoi mon JavaScript `removeEventListener` ne fonctionne-t-il pas ?

Pourquoi RemoveEventListener de Javascript ne fonctionne-t-il pas ?

Lorsqu'ils tentent de supprimer un écouteur d'événement, les utilisateurs peuvent rencontrer des difficultés, ce qui amène à se demander si il y a un problème avec leur mise en œuvre. Pour résoudre ce problème, analysons le code fourni.

Dans l'exemple donné, un écouteur d'événement est attaché à un élément nommé zone pour l'événement de clic. Cependant, lors d'une tentative de suppression ultérieure de l'écouteur dans une autre fonction, sa suppression échoue.

La raison de cet échec réside dans le fait que les deux fonctions anonymes transmises à addEventListener et removeEventListener sont des fonctions distinctes. Bien que les deux gèrent l’événement click sur la zone, ils ne sont pas le même objet fonction. Par conséquent, la suppression de l'écouteur d'événement à l'aide de la même référence de fonction anonyme de addEventListener ne fonctionnera pas.

Pour résoudre ce problème, il est nécessaire d'utiliser la même référence de fonction anonyme pour ajouter et supprimer l'écouteur d'événement. Cela garantit que la fonction removeEventListener peut cibler et supprimer correctement l'écouteur spécifique qui a été ajouté précédemment.

Voici un exemple d'extrait de code corrigé :

<code class="javascript">function foo(event) {
     app.addSpot(event.clientX,event.clientY);
     app.addFlag = 1;
 }
 area.addEventListener('click',foo,true);
 area.removeEventListener('click',foo,true);</code>

En utilisant une fonction nommée comme foo pour le gestionnaire d'événements, le même objet de fonction peut être référencé pour ajouter et supprimer l'écouteur d'événement, garantissant que l'écouteur est correctement supprimé lorsque vous le souhaitez.

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!