Question

我有一个表格中的文字。我用过这段代码

 $('textarea').keypress(function (event) {
        if (event.which == 13) {
            event.preventDefault();
            var s = $(this).val();
            $(this).val(s + "<br />");
        }
    });

允许用户使用enter按钮进入下一行。 我尝试使用了这两个和\ n 在表单中，用户可以转到新行。但是，当输入显示在页面上时，新行不会显示，并且不会显示新行之后的任何文本。但是，它仍然存在 - 如果您去编辑表单，它仍会显示单击Enter后键入的文本。我添加了

white-space: pre-wrap;

进入我的css文件中的文本框的css试图解决问题。但是，它仍然无效。关于如何解决这个问题的任何建议/意见？

Answer 1

您不希望在键入时插入<br/>标记。你真的不想在他们打字时对他们的文字做任何事情。如果要保持换行符，可以在将它们注入元素之前将它们转换为<br/>标记。

$('#text').keyup(function(event) {
  var text = $("#text").val();
  text = text.replace(/(?:\r\n|\r|\n)/g, '<br />');
  $("#result").html(text);
});

textarea {
  min-width: 200px;
  min-height: 200px;
  float: left;
}

#result {
  float: left;
  border: 1px solid red;
  padding: 10px;
  margin-left: 10px;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<textarea id="text" placeholder="Type in here"></textarea>
<div id="result"></div>

添加换行符并显示textarea的输入

1 个答案: