我想要 HTML5 的视觉表示<textarea>标签指示何时存在“硬”换行而不是换行。例如，给定文本：
Hello, world\n
How are you, and this text
wraps to a new line because
it's too long.\n
But this is a proper new line.
我想要一些由换行符分隔的行的视觉指示，例如空格：
Hello world
How are you, and this text
wraps to a new line because
it's too long.
But this is a proper new line.
插入可视字符或文本字符串来代替换行符（例如 ¶）也可以，即
Hello world¶
How are you, and this text
wraps to a new line because
it's too long.¶
But this is a proper new line.
理想情况下，我希望能够使用 CSS 来做到这一点，但我不确定对于这种视觉表示来说合适的（如果存在的话）机制是什么。
如果可能的话，我宁愿不必修改文本区域的内容。
我还更喜欢使用“纯”文本区域标签（而不是 TinyMCE）。
感谢您的阅读，任何想法和建议将不胜感激。
现场演示
<style type="text/css">
#myform textarea {
border: 1px solid #000;
position: absolute;
}
#myform #source {
background: transparent;
z-index: 1;
}
#myform #mirror {
color: rgba(0,0,0,0.5);
z-index: -1;
}
</style>
<script type="text/javascript">
$("#source").keyup(function() {
$("#mirror").val($("#source").val().replace(/\n/g,"¶\n"));
});
</script>
<form id="myform">
<textarea id="source" rows="10" cols="40"></textarea>
<textarea id="mirror" rows="10" cols="40"></textarea>
</form>
Note:仅在 Firefox 3.6.x 上测试。 （IE 需要一些不同的 CSS 来实现不透明度）
本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系:hwhale#tublm.com(使用前将#替换为@)
