从textarea向段落添加换行符

我有一个textarea框，用户在其中键入消息然后输出到paragraph标记。
我成功捕获文本但似乎无法捕获换行符。
inheritance我的小提琴

理想情况下，字符串替换，如
或\n是我正在寻找的。
任何帮助将不胜感激，谢谢。

 var txtBox = $('#myTextArea'); var txt = txtBox.val(); txtBox.keyup(function(){ txt = txtBox.val(); $('p.msg').html(txt); }); txtBox.keydown(function (e) { var keyCode = e.keyCode || e.which; if (keyCode == 13) { $('p.msg').append('
');//ApplyLineBreaks(txt); } }); 

和标记

  
msg here 

Answer 1

你可以只使用keydown事件来做到这一点：

 var txtBox = $('#myTextArea'); txtBox.keydown(function(e){ var that = this; setTimeout(function(){ $("p.msg").html(that.value.replace(/\n/g,"
")); },10); }); 

http://jsfiddle.net/NJwhC/3/

setTimeout很重要，它允许在访问它之前填充this.value 。

Answer 2

您可以使用CSS告诉元素保留空格：

 p.msg { display: block; white-space: pre; }​ 

并简化您的JS代码：

 var $txtBox = $('#myTextArea'); $txtBox.keyup(function(){ $('p.msg').text($txtBox.val()); }).trigger('keyup')​; 

演示： http ： //jsfiddle.net/9a68r/4/

Answer 3

您正在覆盖keyup函数中的
。 摆脱keydown函数并将keyup更改为：

 txtBox.keyup(function(){ $('p.msg').html(txtBox.val().replace(/\n/g, '
')); }); 

Answer 4

您的keyup处理程序将在运行keydown后立即覆盖p.msg的内容。 在你的密钥中使用它：

 $('p.msg').html(txt.replace("\n","
"));