Здравствуйте. У меня есть поле для ввода текста, но когда я передаю его значение в переменную, то оно не совсем корректно передается. Суть в том, что если например поставить перенос строки в textarea ентером то в переменную оно передается как одна строчка без переноса. И ещё если вводить текст до конца поля он автоматически переносится, но в переменную всё равно идет просто строка и на следующем выходе в блок помещается текст который вылазит за его границы. Может есть какие-то корректные способы извлечения значения из textarea? Или можно ли как-то задать, что если текст переходит границу блока чтобы он делал перенос строки. Например заносился в div и чтобы этот div не мог выходить за границу родителя. Спасибо
3 ответа
const textarea_to_div = e => div.innerHTML=textarea.value.replace(/\n/g,'<br/>');
textarea_to_div();
textarea.oninput = textarea_to_div;
<textarea id='textarea'>
Перенос
переносов.
</textarea>
<div id='div'></div>
Попробуйте копнуть в сторону contenteditable
.
$('.block').on('input paste keyup', function() {
console.log($(this).html());
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="block" contenteditable="true">Введите текст</div>
сss для элемента, в котором текст выходит за границу
overflow-Y:scroll;
Для того, чтобы текст переносился на новую строку, нужно вставлять тег <br>
, я думаю
white-space: pre-wrap;
чтобы вообще переходы на новую строку отображались, мб это и вам поможет ?