Event.cancelable
La propriété cancelable
(annulable) de "Event" Indique si l'événement peut être annulé et donc empêché, comme si l'événement ne s'était jamais produit. Si l'événement n'est pas annulable, alors sa propriété cancelable
est à false
(faux) et l'écouteur d'événement ne peut pas l'arrêter.
L'appel de preventDefault()
sur un évènement qui ne peut être annulé produit une erreur, aussi les écouteurs d'évènement qui gèrent de nombreux types d'évènements peuvent être vérifiés avec cancelable
avant d'appeler leurs méthodes preventDefault()
.
La plupart des événements natifs du navigateur qui peuvent être annulés sont ceux qui résultent de l'interaction de l'utilisateur avec la page. L'annulation des événements click, scroll ou beforeunload empêcherait l'utilisateur de cliquer sur un élément, de faire défiler la page ou de la quitter, respectivement.
Syntaxe
bool = event.cancelable;
- Le résultat est un
booléen
qui esttrue
(vrai) si l'événement peut être annulé.
Exemple
Par exemple, les vendeurs de navigateurs proposent que l'évènement wheel
puisse être annulable seulement la première fois que l'écouteur est appelé (ressource en anglais) ; les évènements wheel
suivants ne peuvent être annulés.
function preventScrollWheel(event) {
if (typeof event.cancelable !== "boolean" || event.cancelable) {
// L'événement peut être annulé, alors nous le faisons.
event.preventDefault();
} else {
// L'évènement ne peut pas être annulé, il n'est donc pas sûr
// d'appeler preventDefault() sur lui.
console.warn(`The following event couldn't be canceled:`);
console.dir(event);
}
}
document.addEventListener("wheel", preventCancelableEvents);
Notes
Si l'événement peut être annulé, ou non, est déterminé au moment de l'initialisation de celui-ci.
Pour annuler un événement, utiliser la méthode preventDefault()
sur celui-ci. Cela permet d'empêcher l'action par défaut associée à l'événement de s'exécuter.
Spécifications
Specification |
---|
DOM Standard # ref-for-dom-event-cancelable② |
Compatibilité des navigateurs
BCD tables only load in the browser