jQuery：keyup()：使用文本区域中的内容更新 div...换行符？答案

【问题标题】：jQuery: keyup(): Update div with content from text area... line breaks?jQuery：keyup()：使用文本区域中的内容更新 div...换行符？
【发布时间】：2011-09-06 09:41:45
【问题描述】：

我在这里发布了一个工作版本：http://jsfiddle.net/JV2qW/2/

我有一个文本区域，它使用正在输入的文本更新（在keyup() 上）一个 div。一切正常，除了换行符没有被识别。

html:

<p>enter text</p>
<textarea id='text'></textarea>
<div id='target'></div>

和 jquery：

$('#text').keyup(function(){
      var keyed = $(this).val();
      $("#target").html(keyed);
 });

关于如何将\n 翻译成<br/> 或<p> 标签有什么想法吗？

非常感谢。

【问题讨论】：

标签： jquery line-breaks key-events

【解决方案1】：

你为什么不直接替换键值并替换它？

这里有例子 - 部分转换carrage return

http://lawrence.ecorp.net/inet/samples/regexp-format.php

【讨论】：

【解决方案2】：

http://jsfiddle.net/omnosis/8XL7n/

将'\n' 替换为'<br />'

【讨论】：

你的小提琴只替换了第一个\n
感谢您的指导。这仅适用于 \n 的第一个实例

【解决方案3】：

你可以用<br/>替换任何换行符

$('#text').keyup(function() {
    var keyed = $(this).val().replace(/\n/g, '<br/>');
    $("#target").html(keyed);
});

如果您想替换其他内容，可以查看 MDC 关于 RegEx 的文章。

https://developer.mozilla.org/en/JavaScript/Guide/Regular_Expressions

【讨论】：