Что такое input JavaScript?

"Input js". "Что такое input JavaScript?"

Разберу подробно событие input в JavaScript — как оно работает, когда срабатывает и как его использовать.

Input js

1. Что такое input JavaScript?
2. Живой код input в JavaScript.[
3. Пример input в JavaScript.

1. Что такое input JavaScript?

Событие input в js срабатывает каждый раз при изменении значения в элементах форм.

Оно срабатывает после того, как элемент теряет фокус (blur) после внесения изменений.

Элементы, поддерживающие событие input JavaScript.

<input> (текстовые поля, чекбоксы, радиокнопки, range и др.);

<textarea>

<select>

Примерный синтаксис input JavaScript?

Html :

<input type="text" id="idInput" placeholder="Событие input">

JavaScript :

<script>

document.getElementById('idInput').addEventListener('input', function(e) {

console.log('input: ' + e.target.value);

});

</script>

2. Живой код input в JavaScript.

Давайте соберем собственный пример "input в JavaScript", для этого вам понадобится :

Выше приведенный синтаксис с некоторыми изменениями...

Добавим тег div, чтобы вы могли видеть реальный живой пример прямо здесь на странице...

В него помещаем id с произвольным значением "here".

Любым из способов обратиться по id ..

Используем innerHTML для передачи вводимых данных.

Далее - e.target + value js... получим вот:

here. innerHTML = e.target.value ;

Соберем весь код input в JavaScript.

Html :

<input type="text" id="id_input" placeholder="Событие input">

<div id="here"></div>

JavaScript :

<script>

document.getElementById('id_input').addEventListener('input', function(e) {

here. innerHTML = e.target.value ;

});

</script>

3. Пример input в JavaScript.

Теперь давайте протестируем "input в JavaScript":

Поставьте мышку в поле ввода и введите любое значение... увидите результат "input в JavaScript":

Всего комментариев : Comments+ 2.0

1000

+ =

Отправить