Wydarzenie oninput

Zdarzenia DOM InputEvent

Definicja i zastosowanie

Wydarzenie oninput występuje, gdy element otrzymuje input użytkownika.

To wydarzenie występuje, gdy wartość elementu <input> lub <textarea> ulega zmianie.

Wskazówka:To wydarzenie jest podobne do Zdarzenie onchange. Różnica polega na tym, że wydarzenie oninput występuje natychmiast po zmianie wartości elementu, podczas gdy onchange występuje, gdy element traci fokus i zawartość się zmienia. Inna różnica polega na tym, że wydarzenie onchange również dotyczy elementów <select>.

Przykład

Przykład 1

Kiedy użytkownik pisze zawartość w polu <input>, wykona się JavaScript:

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

Spróbuj sam

Przykład 2

Suwak zakresu - jak dynamicznie aktualizować wartość suwaka:

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

Spróbuj sam

Gramatyka

W HTML:

<element oninput="myScript">

Spróbuj sam

W JavaScript:

obiekt.oninput = function(){myScript};

Spróbuj sam

W JavaScript, używając metody addEventListener():

obiekt.addEventListener("input", myScript);

Spróbuj sam

Komentarz:Internet Explorer 8 lub wcześniejsze wersje nie obsługują Metoda addEventListener().

Szczegóły techniczne

Bąbelkowanie: Wsparcie
Można anulować: Nieobsługiwane
Typy wydarzeń: Event, InputEvent
Obsługiwane znaczniki HTML: <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"> oraz <textarea>
Wersja DOM: Zdarzenia poziomu 3

Wsparcie przeglądarek

Liczby w tabeli wskazują na pierwszą wersję przeglądarki, która w pełni obsługuje to zdarzenie.

Zdarzenia Chrome IE Firefox Safari Opera
oninput Wsparcie 9.0 4.0 5.0 Wsparcie
Zdarzenia DOM InputEvent