HTMLElement: beforeinput event
Baseline
Widely available
This feature is well established and works across many devices and browser versions. It’s been available across browsers since mars 2021.
Expérimental: Il s'agit d'une technologie expérimentale.
Vérifiez attentivement le tableau de compatibilité des navigateurs avant de l'utiliser en production.
L'évènement DOM beforeinput est émis quand la valeur d'un élément <input>, <select>, ou <textarea> est sur le point d'être modifié. L'évènement s'applique également aux éléments ayant l'attribut contenteditable actif, et à tout élément quand le designMode est activé.
Dans le cas de contenteditable et designMode, la cible de l'évènement est l'hôte d'édition. Si ces propriétés s'appliquent à plusieurs éléments, l'hôte d'édition est le plus proche ancêtre dont le parent n'est pas éditable.
| Bouillonne | Oui |
|---|---|
| Annulable | Oui |
| Interface | InputEvent |
| Propriété gestionnaire d'évènement | Aucune |
| Sync / Async | Sync |
| Composé | Oui |
| Action par défaut | Mettre à jour l'élément DOM |
Exemples
Cet exemple affiche la valeur de l'élément <input> juste avant qu'elle soit modifiée.
HTML
<input placeholder="Saisissez du texte" name="name" />
<p id="values"></p>
JavaScript
const input = document.querySelector("input");
const log = document.getElementById("values");
input.addEventListener("beforeinput", updateValue);
function updateValue(e) {
log.textContent = e.target.value;
}
Résultat
Spécifications
| Specification |
|---|
| UI Events # event-type-beforeinput |
Compatibilité des navigateurs
Loading…
Voir aussi
- Évènement associé :
input