Pourquoi mon JavaScript RemoveEventListener ne fonctionne-t-il pas ?

Javascript RemoveEventListener ne fonctionne pas

Lorsque vous tentez d'ajouter et de supprimer des écouteurs d'événement à un élément en Javascript, la fonction RemoveEventListener peut ne pas fonctionner comme prévu . Ce problème survient lorsque la fonction anonyme fournie comme deuxième argument de removeEventListener n'est pas la même référence de fonction qui a été initialement attribuée à addEventListener.

Comprendre le problème

Dans le code fourni, les écouteurs d'événements sont attachés et supprimés à l'aide de fonctions anonymes :

area.addEventListener('click', function(event) { ... }, true);
area.removeEventListener('click', function(event) { ... }, true);

Cependant, ces fonctions anonymes sont des objets complètement différents. Même s'ils peuvent effectuer les mêmes tâches, ils ne sont pas la même référence.

Solution

Pour supprimer correctement un écouteur d'événement, vous devez fournir la même référence de fonction que celle a été utilisé pour ajouter l'auditeur. Définissez une fonction nommée en dehors des appels addEventListener et RemoveEventListener :

function foo(event) {
  app.addSpot(event.clientX, event.clientY);
  app.addFlag = 1;
}
area.addEventListener('click', foo, true);
area.removeEventListener('click', foo, true);

En faisant cela, la fonction RemoveEventListener reconnaît la référence de fonction qui a été initialement attachée et détache avec succès l'écouteur d'événement.

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!