HTML атрибут событий oninput

Значение и применение

Атрибут событий oninput позволяет задать срабатывание скрипта, когда элемент получает ввод данных от пользователя.

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

Поддержка браузерами

Атрибут событий	Chrome	Firefox	Opera	Safari	IExplorer	Edge
oninput	Да	Да	Да	Да	Да	Да

Синтаксис

<element oninput = "script" >

Пример использования

Пример вывода текста, набранного в элементе <input> на "лету", используя атрибут событий oninput html5 . Обратите внимание, что если бы мы использовали атрибут событий onchange, то текст отобразился бы только при смене фокуса целиком.

<!DOCTYPE html>
<html>
<head>
<title>Событие oninput</title>
</head>
<body>
<p>Набирите произвольный текст:</p>
<input type = "text" name = "testInput" id = "testInput" oninput = "testFunction()">
<p id = "info" ></p>
<script>
function testFunction() {
	var x = document.getElementById("testInput").value;
	document.getElementById("info").innerHTML = "Вы набираете следующий текст: " + x;
}
</script>
</body>
</html>

Набирите произвольный текст:

Отличия HTML 4.01 от HTML 5

Атрибут событий oninput html5 является новым в HTML5.

Поддерживаемые теги

<input> (type = "password | search | text") и <textarea>.

Атрибуты событий