TypeError non intercepté: Invocation illégale sur addEventListener

- Je obtenir une Uncaught TypeError: Illegal invocation pour les deux versions de cette tentative de mettre un EventListener: (je reçois le message d'erreur lors de l'auditeur doit être ajouté, pas quand je clique sur la cible)

ronan.addEventListener("click", alert, false);

addEventListener.apply(ronan, ["click", alert, false]);

ronan est un div élément qui est retourné avec succès par la console donc je ne pense pas que ce soit le problème. Des idées pourquoi j'ai cette erreur? J'ai lu cette fil et je ne pouvais pas le comprendre.

source d'informationauteur Artur Sapek | 2011-08-27

  1. 29

    Vous avez besoin d'envelopper alert dans une fonction. Cela va fonctionner:

    ronan.addEventListener("click", function() { alert('Hi'); }, false);

    Voici un violon de la preuve. À l'aide de alert seul ne fonctionne pas parce que lorsqu'un écouteur est exécuté à la valeur de this à l'intérieur de cette fonction est définie sur l'objet sur lequel il est à l'écoute. Par exemple, si vous définissez un listener sur ronanau sein de cet auditeur this === ronan. Cela pose un problème pour alert parce que la fonction attend this être égale à window. Vous pouvez contourner ce (no pun intended) par emballage de la fonction dans une autre fonction, ou en le liant à ce qu'il s'attend à ce this:

    document.body.addEventListener('click', alert.bind(window), false);

    N'oubliez pas que dans IE < 9, vous devez utiliser attachEvent plutôt que addEventListener.

    Une remarque sur l'utilisation de apply/call avec addEventListener

    Votre deuxième tentative ne fonctionne pas parce que vous essayez d'appliquer vos arguments pour window.addEventListenerpar opposition à HTMLElement.prototype.addEventListenerqui est une fonction différente:

    //This won't work
addEventListener.apply(ronan, ["click", alert.bind(window), false]);

//This will work
HTMLElement.prototype.addEventListener.apply(ronan, ['click', alert.bind(window), false]);