Dernière mise à jour le .
Event.setEventByName
Assigne un ensemble d'événements associés à un nom à un ensemble de noeuds DOM.
L'assignation d'événements par nom simplifie leur manipulation lorsqu'ils sont susceptible d'être ajoutés, supprimés, activés ou désactivés régulièrement.
Les méthodes "ByName" suivent le même comportement que la fonction setEvent
.
Synthaxe
Event.setEventByName(domList, assocName, eventString, eventFct1[, ..., eventFctN][, capture]);
Event.setEventByName(domList, assocName, eventString, eventFct1[, ..., eventFctN][, option]);
Event.setEventByName(domList, assocName, objt1[, ..., objtN][, capture]);
Event.setEventByName(domList, assocName, 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 sur lesquels il faut ajouter un ou plusieurs événements. Les noeuds ne supportant pas la méthode DomElement.addEventListener seront ignorés. Utilisez le sous-module Compatibility.eventListener afin d'étendre la compatibilité du module. -
assocName
: chaine de charactère représentant un nom à associer à l'ensemble des fonctionseventFct...eventFctN
pour chaqueeventString
. -
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. -
eventFct1...eventFctN
[]: fonction ou tableau de fonction à associer avec le ou les événements définis pareventString
. -
capture
Facultatif: correspond à la valeur decapture
à 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.addEventListener 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
Le tableau domList
est retourné.
Exemple sans Dynamique
Exemple 1: Ajout d'événements par nom
L'exemple ci-dessous associe deux fonctions au nom myEventName
pour les événements click mousemove rightclick
à document.body
.
Ces événements pourront alors être supprimés, activés ou désactivés plus simplement par la suite du code et ceux sans avoir eu besoins de se soucier du stockage dans un context de ces événements.
Event.setEventByName([document.body], "myEventName", "click onmousemove onRightclIcK", function() {
console.log("Event fired function 1 !");
}, function() {
console.log("Event fired function 2 !");
});
Event.disabledEventByName([document.body], "myEventName"); // Les événements sont supprimés temporairement
Event.enabledEventByName([document.body], "myEventName"); // Les événements sont ré-assignés
Event.removeEventByName([document.body], "myEventName"); // Les événements sont supprimés définitivement
Exemple 2: Ajout d'événements par nom avec un objet
Les méthodes "ByName" suivent le même comportement que la fonction setEvent
. L'équivalent du premier exemple utilisant la synthaxe supportant les objets est présenté ci-dessous.
Event.setEventByName([document.body], "myEventName", {
"click onmousemove onRightclIcK" : [function() {
console.log("Event fired function 1 !");
}, function() {
console.log("Event fired function 2 !");
}]
});
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 2 mais avec l'utilisation de Dynamique
.
Dynamique(document.body).setEventByName("myEventName", {
"click onmousemove onRightclIcK" : [function() {
console.log("Event fired function 1 !");
}, function() {
console.log("Event fired function 2 !");
}]
});
Compatibilité
La prise en charge de DomElement.addEventListener ou l'utilisation d'un PolyFill équivalent est nécessaire. Méthode codée en EcmaScript 6.
Méthodes liées
-
Méthode disabledEventByName: .
-
Méthode enabledEventByName: .
-
Méthode callEventByName: .
-
Méthode removeEventByName: .