0

在 dblclick - DIV 被替换为 TEXTAREA。您可以编辑文本。

模糊时 - TEXTAREA 被替换为 DIV。新行替换为“< br />”。

第一个问题- 在编辑的文本中 - “< br />”不像文本中的换行或换行，而是像文本“< br />”。如何解决？

第二个问题 - 示例中有一个“< br />”。当您第一次编辑示例中的文本时，此“< br />”不会更改为换行符，而只会更改为简单的空格（&nsbp;）。为什么第一次尝试编辑原始文本时会出现此错误？

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 />")));}));
    });
});
4

2 回答 2

2

尝试使用 . html () 而不是 . text ( ) 并更改替换

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

请参阅此链接。您可以将宽度和高度添加到此

于 2013-06-18T08:57:58.403 回答
1

请使用下面的代码

  $(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 标签

于 2013-06-18T09:40:18.317 回答