EventListener

L'interface EventListener représente un objet qui peut gérer un évènement distribué par un objet EventTarget.

Note : En raison du besoin de compatibilité avec le contenu existant, EventListener accepte à la fois une fonction et un objet avec une fonction de propriété handleEvent. Ceci est illustré dans l'exemple ci-dessous.

Propriétés

Cette interface n'implémente ni n'hérite d'aucune propriété.

Méthodes

Cette interface n'hérite d'aucune méthode.

EventListener.handleEvent() (en-US): une fonction qui est appelée lorsque se produit un événement du type spécifié.

Exemple

HTML

<button id="btn">Click here!</button>

JavaScript

const buttonElement = document.getElementById('btn');

// Ajoute un gestionnaire pour l'évènement 'click' qui fournit une fonction de rappel.
// Chaque fois que l'élément est cliqué, une fenêtre contextuelle avec "Élément clické!"
// apparaîtra.
buttonElement.addEventListener('click', function (event) {
  alert('Element clicked through function!');
});

// Pour la compatibilité, un objet qui n'est pas une fonction avec une propriété `handleEvent` (gestion d'évènement)
// sera traitée exactement comme la fonction elle-même.
buttonElement.addEventListener('click', {
  handleEvent: function (event) {
    alert('Element clicked through handleEvent property!');
  }
});

Résultat

Spécifications

Spécification	Statut	Commentaire
DOM La définition de 'EventListener' dans cette spécification.	Standard évolutif	Pas de changement.
Document Object Model (DOM) Level 2 Events Specification La définition de 'EventListener' dans cette spécification.	Obsolete	Définition initiale.