В данном уроке вы с вами разберем событие
change
, возникающее в полях ввода
при их изменениях. Что это значит? Пусть,
к примеру, у вас есть инпут и в нем есть
какой-то текст. Если вы измените этот текст,
то в этом случае и возникнет это событие.
Давайте посмотрим на примере. Пусть у нас есть инпут:
<input id="elem" value="text">
Давайте по его изменению выведем в консоль его новое значение:
let elem = document.querySelector('#elem');
elem.addEventListener('change', function() {
console.log(this.value);
});
Дан инпут и абзац. По изменению инпута выведите его текст в абзац.
Дан чекбокс. По изменению чебокса выведите на экран его новое состояние.
Расскажите, в чем разница между событиями blur и change.
Дан инпут. По его изменению проверьте, количество
символов в нем меньше 5
-ти или нет.
Если меньше - покрасьте границу инпута в
зеленый цвет, а если больше - в красный.