我有地址填<p>
标签。单击编辑按钮后,我将 <p>
变为标签地址改成<textarea>
允许用户编辑它。
但每当用户点击编辑时,地址文本来自<p>
在 <textarea>
中获取标签没有换行符。
HTML 标记:
<a href="" class="editShipAdd">Edit</a>
<a href="" class="saveShipAddBtn">Save</a>
<table class="table shipping-address-table">
<tbody>
<tr>
<td>
<div class="jumbotron custjumbo">
<p class="datainfo" id="shipping_address">123, Sample Street,<br>
Sample Sample Road,<br> Bangalore, <br>Karnataka - 123xyz</p>
</div>
</td>
</tr>
</tbody>
</table>
JS代码:
$(".editShipAdd").on("click", function(e){
e.preventDefault();
var datasets = $('.shipping-address-table>tbody>tr td').find(".datainfo");
var savebtn = $('.saveShipAddBtn');
datasets.each(function(){
var theid = $(this).attr("id");
var newid = theid+"-form";
var currval = $(this).text().replace(/\r?\n/g, '<br />');
console.log(currval);
$(this).html('<textarea name="'+newid+'" id="'+newid+'" value=""
class="form-control">'+currval+'</textarea>');
});
$(this).css("display", "none");
savebtn.css("display", "inline-block");
});
$(".saveShipAddBtn").on("click", function(e){
e.preventDefault();
var elink = $(this).prev(".editShipAdd");
var datasets = $('.shipping-address-table>tbody>tr td').find(".datainfo");
datasets.each(function(){
var newid = $(this).attr("id");
var einput = $("#"+newid+"-form");
var newval = einput.val().replace(/\r?\n/g, '<br />');
console.log(newval);
einput.remove();
$(this).html(newval);
});
$(this).css("display", "none");
elink.css("display", "inline-block");
});
为了查看问题,我在这里创建了一个 fiddle demo
最佳答案
要换行使用
$(this).html()
而不是$(this).text()
.要在文本区域内使用换行符,请替换
<br>
与

这是 ASCII 等效项。
这一行:
var currval = $(this).text().replace(/\r?\n/g, '<br />');
应该是:
var currval = $(this).html().replace(/<br> ?/g, '
');
已更新 JSFiddle
关于javascript - 在 textarea 中使用 jQuery .text() 保留换行符,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/37297282/