Bezdepbonusu7Программирование: статьи и ответы

Вопрос

Замените /n на ‹br /› в тексте из textarea

Автор вопроса: PatrikОтветов: 2

При dblclick - DIV заменяется на TEXTAREA. Вы можете редактировать текст.

При размытии: TEXTAREA снова заменяется на DIV. И новая строка заменяется на "‹br />".

Первая проблема - в редактируемом тексте - "‹br />" - это не разрыв или новая строка в тексте, а просто текст "‹br". сильный> />". Как это исправить?

Вторая проблема - в примере есть один "‹br />". Когда вы редактируете текст в примере в первый раз, этот "‹br />" не меняется на новую строку, а только на простой пробел (). Почему появляется эта ошибка, когда вы пытаетесь отредактировать текстовый оригинал в первый раз?

ДЕМО-версия jsFiddle

HTML

<div id="meText">Click to edit <br /> this text.</div>

jQuery

$(function(){
    $("#meText").live('click',function(){
        var originalDiv = this;
        $(this).replaceWith($("<textarea></textarea>").text($(this).text().replace(/<br\s?\/?>/g,"\n")).width($(this).width()).height($(this).height()).blur(function(){$(this).replaceWith($(originalDiv).text($(this).val().replace(/\r\n|\r|\n/g,"<br />")));}));
    });
});
  • @Partik мой ответ работает на тебя..?? Gautam3164 18.06.2013

jquerytextareanewlinebreak

Ответы

Ответ 1 · рейтинг 2 · Gautam3164

Попробуйте использовать .html() вместо .text() и измените replace как

$(function(){
$("#meText").on('click',function(){
    var originalDiv = this;
    $(this).replaceWith($("<textarea></textarea>").html($(this).text().replace(/\n/g, "<br />")));
  });
});

См. эту ССЫЛКА. Вы можете добавить свою ширину и высоту к этому

Ответ 2 · рейтинг 1 · Mahesh

пожалуйста, используйте код ниже

  $(this).replaceWith($("<textarea></textarea>").text($(this).html().replace(/<br\s?\/?>/g,"\n")).width($(this).width()).height($(this).height()).blur(function(){$(this).replaceWith($(originalDiv).html($(this).val().replace(/\r\n|\r|\n/g,"<br />")));}));

вы используете какое-то место text() вместо html(). если мы используем text(), он удаляет тег html

Перевод вопроса и ответов сообщества Stack Overflow, лицензия CC BY-SA. Оригинал на Stack Overflow.

Похожие материалы