Question

＆＃13;

$("textarea").blur(function() {
  $("div").html($("textarea").val());
});

$("textarea").blur();

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<textarea style="height:50px;">
1. test
2. test
3. test
</textarea>

<div style="word-break: break-all;"></div>

＆＃13;

我想让文本以与textarea中显示的确切方式显示在div中。

我已尝试使用word-break等css div，但没有一个有效。

注意：具体来说，我只是想知道如何在div中做到这一点。

Answer 1

尝试将white-space:pre;或white-space:pre-wrap;设置为div。

$("textarea").blur(function() {
  $("div").html($("textarea").val());
});

$("textarea").blur();

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<textarea style="height:50px;">
1. test
2. test
3. test
</textarea>

<div style="white-space:pre;"></div>

Answer 2

如果您希望他们能够将其导出为HTML。

str = str.replace(/(?:\r\n|\r|\n)/g, '<br />');

参考：How do I replace all line breaks in a string with <br /> tags?

在textarea中保留outputed div中的换行符

2 个答案: