Javascript 如何获取textarea值并维护HTML样式

我正在为我的web应用程序构建一个注释模块

在应用程序中，我需要注释。当用户发表评论时，我希望jQuery获取TextArea的值，然后将其插入页面

。问题是，当它插入内容时，它会丢失HTML格式，主要是分页符/返回，这会让用户感到困惑。如何修复代码以保留HTML样式

片段： comments.js

var textsubmitted = $("#write-new-comment-textarea").val();
var commentStr = '<li><div class=\"comment-header\"><span class=\"comment-avatar\"><a href=\"/user-view/' + data.personid + '/\"><img src=\"' + data.profilepicsrc + '\" /></a> </span><span class=\"comment-author\"><a href=\"/user-view/' + data.personid + '/\"> <b>' + data.personname + '</b> </a></span><span class=\"comment-timestamp\">just now</span> </div><div class=\"comment-body\"><p>' + textsubmitted + '</p></div></li>';

var textsubmitted=$（“#编写新注释textarea”）.val（）；
var commentStr='
刚才'+textsubmitted+'
；

谢谢，试试这个

var textsubmitted=$（“#编写新注释textarea”）.val（）；
var commentStr='
'+
''+
''+
''+
''+
''+
'
刚才的+
''+
''+
“”+brbr（textsubmitted）+“
”+
“
”；
函数brbr（str）{
var breakTag='
'；
返回（str+''）。替换（/（[^>\r\n]？）（\r\n |\n\r |\r |\n）/g，'$1'+breakTag+'$2'）；
}​

您需要转义textsubmitted字符串。如果设置div的text属性，jquery会自动执行该操作。因此，您只能构建commentsStr的HTML部分，将其附加到dom中，然后稍后为其分配文本值

var textsubmitted = $("#write-new-comment-textarea").val();
var commentStr = '<li><div class=\"comment-header\"><span class=\"comment-avatar\"><a href=\"/user-view/' + data.personid + '/\"><img src=\"' + data.profilepicsrc + '\" /></a> </span><span class=\"comment-author\"><a href=\"/user-view/' + data.personid + '/\"> <b>' + data.personname + '</b> </a></span><span class=\"comment-timestamp\">just now</span> </div><div class=\"comment-body\"><p></p></div></li>';
$("div.comment-body").text(textsubmitted);

var textsubmitted=$（“#编写新注释textarea”）.val（）；
var commentStr='
刚才
'；
$（“div.comment-body”）.text（text已提交）；

这也很好地解决了问题：

---

var textsubmitted2show=$（'write new comment textarea'）.val（）。替换（/\n/g，
'）

你在哪里添加这些数据？我正在将其添加到评论列表（UL）中。你选择的答案有问题。。请阅读下面的我的评论…这是cleaver，但

$（“div.comment-body”）

还不存在。。。我想是吧？：）通过OP的html结构，我知道有很多

$（“div.comment-body”）

。。。而你正在替换它的内容。。。所有这些。。。

var textsubmitted = $("#write-new-comment-textarea").val();
var commentStr = '<li><div class=\"comment-header\"><span class=\"comment-avatar\"><a href=\"/user-view/' + data.personid + '/\"><img src=\"' + data.profilepicsrc + '\" /></a> </span><span class=\"comment-author\"><a href=\"/user-view/' + data.personid + '/\"> <b>' + data.personname + '</b> </a></span><span class=\"comment-timestamp\">just now</span> </div><div class=\"comment-body\"><p></p></div></li>';
$("div.comment-body").text(textsubmitted);