Как вставить новую строку в div, которая отображает изменения в texterea с помощью jQuery

Question

У меня есть текстовое поле в форме, и мне нужно увидеть, что я набираю там в отдельном разделе, как на этом сайте, когда вы публикуете вопрос или ответ.
В текстовой области я получил текст из новой строки при нажатии клавиши ввода, но в тексте div остается в той же строке. Как я могу перейти на новую линию там?

Я использую это:

<script type="text/javascript">
        $('textarea#message').bind('keyup',function(){
            enteredText = $('textarea').attr('value');
            $('#changetext').text(enteredText);
        });
</script>
<div id="changetext">
</div>
<div><form id="sendgreet" action="">
            <dl>
                <dt><label for="message">Text:</label></dt><dd><textarea cols="24" rows="6" id="message"></textarea></dd>
            </dl>
        </form>
</div>

P.S .: На самом деле мне не нужны никакие html-функции, просто обычный текст со вставкой новой строки.

Answer 1

Попробуйте изменить div "changetext" на предварительный тег. Тогда он должен сохранить все возвраты каретки.

Answer 2

var target = $("target_div");
$('textarea').bind("keydown",function() {
  target.html($(this).val().replace(/\r\n/g,'\n').replace(/\n/g,'<br>'));
});

Обрабатывает переводы строк как в Unix, так и в Windows.

Вы можете вставить текст в pre, но это не обернет его для вас.