Dernière mise à jour le .
  1. Documentation
  2. >
  3. Modules
  4. >
  5. Event
  6. >
  7. removeEvent

Event.removeEvent

Supprime un ensemble d'événements d'un ensemble de noeuds DOM.

Synthaxe

Event.removeEvent(domList, eventString, eventFct1[, ..., eventFctN][, capture]);
Event.removeEvent(domList, eventString, eventFct1[, ..., eventFctN][, option]);
Event.removeEvent(domList, objt1[, ..., objtN][, capture]);
Event.removeEvent(domList, objt1[, ..., objtN][, hasOption, option]);

Lorsque le module Event est utilisé avec Dynamique.js, le paramètre domList doit être omis car il est remplacé par la valeur this fourni à la fonction.

Où:

  • domList : tableau contenant un ou plusieurs noeuds DOM deslesquels il faut supprimer un ou plusieurs événements. Les noeuds ne supportant pas la méthode DomElement.removeEventListener seront ignorés. Utilisez le sous-module Compatibility.eventListener afin d'étendre la compatibilité du module.

  • eventString : chaine de charactère définissant un ou plusieurs événements séparés par un unique espace (" ") donc chacun commence ou non par "on" et étant insensible à la casse.

  • eventFct...eventFctN []: fonction ou tableau de fonction à associer avec le ou les événements définis par eventString.

  • capture Facultatif: correspond à la valeur de capture à utiliser avec ma méthode DomElement.addEventListener. Consulter sa documentation pour plus de détails.

  • option Facultatif: objet facultatif possédant des propriétés définies soit par la méthode DomElement.removeEventListener soit par un événement simulé donné. Consultez les nécessités aux fonctionnements des événements simulés utilisés pour en savoir plus.

  • objt1...objtN : sont des objets dont les propriétés suivent la définition { eventString : eventFct } ou { eventString : [eventFct[, ..., eventFctN]] }.

  • hasOption Facultatif: défini si un objet de paramétrage est fourni lors de l'appel de la fonction. Il a été mis en place car il est impossible de différencier des objets d'options

Valeur de retour

Si le module est utilisé sans Dynamique, le tableau domList est retourné. Sinon, le tableau fourni à la fonction via le paramètre this est retourné.

Exemple sans Dynamique

Exemple 1: Suppression d'événements en ligne

L'exemple ci-dessous associe puis supprime deux fonctions aux événements de clique, déplacement de souris ou clique droit du noeud DOM body. Comme précisé à la section Synthaxe, la chaine de caractère définissant les événements contient un ou plusieurs nom d'événement séparé par un unique espace (" "), chacun commençant ou non par "on" et n'étant pas sensible à la casse. Vous remarquerez que la chaine contenant le nom des événements n'est pas identique lors de l'ajout et de la suppression des événements. Dans les deux cas, les chaines seront interprétées de manière équivalente comme "click mousemove rightclick".

const target = [document.body]; const event1 = () => console.log("Event fired function 1 !"), event2 = () => console.log("Event fired function 2 !"); Event.setEvent(target, "click onmousemove onRightclIcK", event1, event2); Event.removeEvent(target, "clIck MouseMove onrightclick", event1, event2);

Exemple 2: Suppression d'événements par objets

L'équivalent du premier exemple utilisant la synthaxe supportant les objets est présenté ci-dessous.

const target = [document.body]; const event1 = () => console.log("Event fired function 1 !"), event2 = () => console.log("Event fired function 2 !"); Event.setEvent(target, { "click onmousemove onRightclIcK" : [event1, event2] }); Event.removeEvent(target, { "clIck MouseMove onrightclick" : [event1, event2] });

Exemple 3: Utilisation de paramètres

Il est aussi possible de transmettre des paramètres en dernier argument. Ces paramètres doivent être soit utilisés par un événement simulé soit utilisés par la méthode DomElement.removeEventListener soit les deux. Ici, on ajoute le paramètre once qui, d'après la documentation, fera en sorte que les fonctions ne soient éxécutées que la première fois de leur appel.

const target = [document.body]; const event1 = () => console.log("Event fired function 1 !"), event2 = () => console.log("Event fired function 2 !"); Event.setEvent(target, "click onmousemove onRightclIcK", event1, { once : true }); Event.removeEvent(target, "clIck MouseMove onrightclick", event1, { once : true });

Exemple 4: Utilisation de paramètres avec des objets

Dans le cas d'utilisation de la synthaxe supportant les objets et l'utilisation de paramètre, il est nécessaire d'utiliser un tel qu'exposé ci-dessous.

const target = [document.body]; const event1 = () => console.log("Event fired function 1 !"), event2 = () => console.log("Event fired function 2 !"); Event.setEvent(target, { "click onmousemove onRightclIcK" : [event1, event2] }, true, { once : true }); Event.removeEvent(target, { "click onmousemove onRightclIcK" : [event1, event2] }, true, { once : true });

Exemple avec Dynamique

Lorsque le module est utilisé avec Dynamique.js, le fonctionnement des méthodes est identique mais le premier argument est à omettre, puisque c'est Dynamique lui même qui se charge de transmettre les noeuds DOM concernés. Le code ci-dessous reprend l'exemple 4 mais avec l'utilisation de Dynamique.

const event1 = () => console.log("Event fired function 1 !"), event2 = () => console.log("Event fired function 2 !"); Dynamique(document.body).setEvent(target, { "click onmousemove onRightclIcK" : [event1, event2] }, true, { once : true }).removeEvent(target, { "click onmousemove onRightclIcK" : [event1, event2] }, true, { once : true });

Compatibilité

La prise en charge de DomElement.removeEventListener ou l'utilisation d'un PolyFill équivalent est nécessaire. Codé en EcmaScript 6.

Méthodes liées

  • Méthode setEvent: Assigne un ensemble d'événements à un ensemble de noeuds DOM.