Событие oninput

События DOM InputEvent

Определение и использование

Событие oninput возникает при получении пользователем ввода элементом.

Это событие возникает при изменении значения элемента <input> или <textarea>.

Совет:Это событие похоже на Событие onchange. Разница заключается в том, что событие oninput возникает сразу после изменения значения элемента, а событие onchange возникает, когда элемент теряет фокус и содержание изменяется. Другое различие заключается в том, что событие onchange также применяется к элементам <select>.

Пример

Пример 1

Когда пользователь写入 содержимое в поле <input>, выполняется JavaScript:

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

Попробуйте сами

Пример 2

Регулируемый слайдер - как динамически обновлять значение слайдера:

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

Попробуйте сами

Грамматика

В HTML:

<элемент oninput="myScript">

Попробуйте сами

В JavaScript:

объект.oninput = function(){myScript};

Попробуйте сами

В JavaScript, используйте метод addEventListener():

объект.addEventListener("input", myScript);

Попробуйте сами

Примечание:Internet Explorer 8 и более ранние версии не поддерживают Метод addEventListener().

Технические детали

Баллирование: Поддержка
Можете ли вы отменить: Не поддерживается
Тип события: Event, InputEvent
Поддерживаемые теги 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"> и <textarea>
Версия DOM: Уровень 3 событий

Поддержка браузеров

Числа в таблице указывают на первую версию браузера, которая полностью поддерживает это событие.

События Chrome IE Firefox Safari Opera
oninput Поддержка 9.0 4.0 5.0 Поддержка
События DOM InputEvent