Изменить событие для текстовой области
У меня есть задача, где я должен иметь возможность поместить любой текст в <textarea>, тогда текст сразу будет отображаться в <p>. Я пытаюсь сделать это с помощью addEventListener, который отлично работает с полем ввода, но по некоторым причинам не работает для текстового поля.
let textArea = document.querySelector('.text-area')
let output = document.querySelector('.p-tag')
textArea.addEventListener('change', updateValue)
function updateValue(e){
output.textContent = e.target.value
}
поэтому вместо этого используйте прослушиватель событий keyUp
Используйте событие input вместо keyup или change для лучшей совместимости с сенсорными устройствами, у которых нет «ключей».
Как это работает с полем ввода, но не с текстовой областью? Поведение идентично коду, который вы предоставили.
![Безумие обратных вызовов в javascript [JS]](https://i.imgur.com/WsjO6zJb.png)
Ответы 1
Вместо этого используйте событие input:
Примечание. Событие
inputзапускается каждый раз, когда изменяетсяvalueэлемента. Это отличается от события change, которое срабатывает только тогда, когда значение зафиксировано, например, при нажатии клавиши ввода, выборе значения из списка параметров и т. п.
Из изменить:
В зависимости от типа изменяемого элемента и способа взаимодействия пользователя с элементом событие
changeсрабатывает в разный момент:
- […]
- Когда элемент теряет фокус после того, как его значение было изменено, но не зафиксировано (например, после редактирования значения <textarea> или <input type="text">).
Вместо этого вы можете использовать событие onkeyup.