2

Всю голову сломал, делаю следующее: копирую текстовый контент в модальное окно-форму в textarea. Необходимо авто-изменение высоты textarea без события на самом textarea, т. е. закидываю текст в textarea, и он автоматом меняет высоту в зависимости от контента в нём.

0

1 ответ 1

4

Всё равно ничего лучше не придумаешь:

document.querySelector('textarea').addEventListener('input', function (e) {
  e.target.style.height = 'auto'
  e.target.style.height = e.target.scrollHeight + 2 + "px"
})
textarea {
  display: block;
  width: 100%;
  box-sizing: border-box;
  resize: none;
  min-height: 3em;
}
<textarea></textarea>

Если требуется, чтобы она ещё под начальный текст приняла нужный размер, то можно явно вызвать соответствующую функцию:

function fixTextareaSize(textarea) {
  textarea.style.height = 'auto'
  textarea.style.height = textarea.scrollHeight + 2 + "px"
}

~function () {
  var textarea = document.querySelector('textarea')
  textarea.addEventListener('input', function (e) { fixTextareaSize(e.target) })
  fixTextareaSize(textarea)
}()
textarea {
  display: block;
  width: 100%;
  box-sizing: border-box;
  resize: none;
  min-height: 3em;
}
<textarea>Всю голову сломал, делаю следующее, копирую текстовый контент в модальное окно-форму в textarea, необходимо авто-изменение высоты textarea БЕЗ СОБЫТИЯ НА САМОМ textarea, т.е. закидываю текст в textarea и он автоматом меняет высоту в зависимости от контента в нём.</textarea>

Ваш ответ

By clicking “Отправить ответ”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.