заменить разрывы строк, чтобы заставить их работать с jquery

Question

У меня есть следующий небольшой скрипт для предварительного просмотра текста перед его отправкой на хранение в базу данных:

jQuery(function($) {
    var input = $('#contents'),
    preview = $('#previewaccordion div.viewcontents');

    input.keyup(function(e) {
        preview.html(input.val());
    });
});

, но если я набираю текст с разрывами строк, он игнорирует их и записывает их все в одну строку,Как я могу заменить разрывы строк, чтобы они правильно отображались?

Answer 1

Я предполагаю, что вы используете текстовую область для ввода. В качестве разрывов строк используются \ n, которые не влияют на HTML. Поэтому вы должны заменить их на br-теги:

input.val().replace(/\n/g, "<br />");

Answer 2

Это не имеет ничего общего с jQuery: разрывы строк в HTML не имеют значения, они просто пробелы (например, пробелы и табуляции).

Чтобы принудительно переводить строки в HTML, вы используете тег <br>.Таким образом, вы можете изменить

preview.html(input.val());

на

preview.html(input.val().replace(/\r?\n/g, '<br>'));

Обратите внимание, что вы также не экранируете специальные символы HTML (например, < или &), и поэтому, если вы наберетеих, ваш вывод может быть неверным.Таким образом, вы могли бы пойти с:

preview.html(input.val().replace(/&/g, '&amp;').replace(/</g, '&lt;').replace(/\r?\n/g, '<br>'));

И, наконец, я бы подключил keypress, а также keyup, так что вы видите символы, созданные с помощью повтора ключа (который запускает keypress, но не keyup).

Живой пример | источник

Answer 3

Hiya демо здесь: http://jsfiddle.net/STnhV/1/

надеюсь, это поможет!ура!

Код Jquery:

$(document).ready(function() {
    $('#inputfoo').keyup(function() {
       $('#outputbar').html($(this).val().replace(/\n/g,'<br/>')); 
    });
});

​

Answer 4

Замена разрыва строки на теги разрыва html при отображении вывода из базы данных.