Evento oninput

Definizione e uso

L'evento oninput si verifica quando l'elemento riceve l'input dell'utente.

Questo evento si verifica quando il valore dell'elemento <input> o <textarea> cambia.

Suggerimento:Questo evento è simile a Evento onchange. La differenza è che l'evento oninput si verifica immediatamente dopo che il valore dell'elemento cambia, mentre onchange si verifica quando l'elemento perde il focus e il contenuto cambia. Un'altra differenza è che l'evento onchange si applica anche agli elementi <select>.

Esempio

Esempio 1

Quando l'utente scrive nel campo <input>, eseguire JavaScript:

<input type="text" oninput="myFunction()">

Prova personalmente

Esempio 2

Slittamento a scorrimento - Come aggiornare dinamicamente il valore dello slittamento:

<input type="range" oninput="myFunction(this.value)">

Prova personalmente

Sintassi

In HTML:

<elemento oninput="myScript">

Prova personalmente

In JavaScript:

oggetto.oninput = function(){myScript};

Prova personalmente

In JavaScript, utilizzare il metodo addEventListener():

oggetto.addEventListener("input", myScript);

Prova personalmente

Nota:Internet Explorer 8 o versioni precedenti non supportano Metodo addEventListener().

Dettagli tecnici

Bubbling: Supporto
Cancellabile: Non supportato
Tipo di evento: Evento, InputEvent
Etichette HTML supportate: <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"> e anche <textarea>
Versione DOM: Eventi livello 3

Supporto browser

I numeri nella tabella indicano la versione del browser che supporta completamente l'evento.

Eventi Chrome IE Firefox Safari Opera
oninput Supporto 9.0 4.0 5.0 Supporto