oninput- gebeurtenis
Voorbeeld
Voer een JavaScript uit wanneer een gebruiker iets schrijft in een <input>-veld:
<input type="text" oninput="myFunction()">
Meer "Probeer het zelf" voorbeelden hieronder.
Definitie en gebruik
De oninput-gebeurtenis treedt op wanneer een element gebruikersinvoer krijgt.
Deze gebeurtenis vindt plaats wanneer de waarde van een <input>- of <textarea>-element wordt gewijzigd.
Tip: Dit evenement is vergelijkbaar met het onchange evenement. Het verschil is dat de oninput-gebeurtenis onmiddellijk plaatsvindt nadat de waarde van een element is gewijzigd, terwijl onchange optreedt wanneer het element de focus verliest, nadat de inhoud is gewijzigd. Het andere verschil is dat de gebeurtenis onchange ook werkt op <select> elementen.
Browserondersteuning
De cijfers in de tabel geven de eerste browserversie aan die de gebeurtenis volledig ondersteunt.
| Event | |||||
|---|---|---|---|---|---|
| oninput | Yes | 9.0 | 4.0 | 5.0 | Yes |
Syntaxis
In HTML:
<element oninput="myScript">
In javascript:
object.oninput = function(){myScript};
In JavaScript, met behulp van de addEventListener()-methode:
object.addEventListener("input", myScript);
Opmerking: de methode addEventListener() wordt niet ondersteund in Internet Explorer 8 en eerdere versies.
Technische details
| bubbels: | Ja |
|---|---|
| Annuleerbaar: | Nee |
| Evenementtype: | Evenement , InvoerEvent |
| Ondersteunde HTML-tags: | <input type="color">, <input type="date">, <input type="datetime">, <input type="email">, <input type="month">, <input type=" number">, <input type="password">, <input type="range">, <input type="search">, <input type="tel">, <input type="text">, < input type="time">, <input type="url">, <input type="week"> en <textarea> |
| DOM-versie: | Niveau 3 Evenementen |
Meer voorbeelden
Voorbeeld
Bereikschuifregelaar - hoe de schuifregelaarwaarde dynamisch bij te werken:
<input type="range" oninput="myFunction(this.value)">