Не передаются все свойства текста при перемещении его

25 ноября 2020, 03:20

$(document).on("keyup", '.create--post--text', function(e) {
    var text= $('.create--post--text').val();
    $('.preview--post--text').html(text);
});
<div class="form-group label-floating is-empty mb-1">
    <textarea class="form-control create--post--text" name="post" placeholder="Расскажите миру какие события сегодня произошли в вашем городе"></textarea>
</div>

Answer 1

Это потому что перенос строки в полях ввода обозначается символом \n,
А в других HTML элементах <br>

Поэтому берем \n и подменяем его на br

$(document).on("keyup", '.test-1', function() { 
    var moo = $(this).val(); 
    $('.test-2').html( moo.replace(/\n/g,'<br>') ); 
});

textarea {width: 400px; height: 100px;}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> 
 
<textarea class="test-1">Продажа газированной воды в летний день 
Москва, 1958 год.</textarea> 
 
<div class="test-2"></div>

P.s. код такого вида всё равно не будет работать для нескольких элементов. Тогда тем более классы стоит заменить на id...