返回键在<textarea>

Question

我对在 asp.net 页面上定义的文本区域有疑问。文本区域在后端填充，文本直接从 mssql 数据库读取。

<div id="emailForm" runat="server" style="display:inline;">
  <textarea name="Body" id="Body" rows="20" cols="20">
     text in here
  <textarea>
</div>

以下 CSS 应用于 emailForm div：

padding: 5px;
width: 750px;
font-family: Lucida Sans, Verdana, Arial, Helvetica, sans-serif;
font-size: 0.9em;
margin: 0px 0px 10px 0px;
border: 2px solid #ccc;

和文本区域本身：

height: 360px;

一些用户报告说，虽然他们可以在文本区域内编辑文本，但无法使用返回键。无法添加新行？

我在网上搜索过，但找不到发生这种情况的例子。如果有人有任何好主意，我很想听听。谢谢。

Answer 1

添加到 Christoffer 的答案中，如果您遇到同样的问题，可以通过替换以下代码来解决：

$(window).keydown(function(event){
    if(event.keyCode == 13) {
      event.preventDefault();
      return false;
    }
  });

这个：

$(window).keydown(function(event){
    if((event.which== 13) && ($(event.target)[0]!=$("textarea")[0])) {
      event.preventDefault();
      return false;
    }
  });

这将允许文本区域输入（新行），仍然阻止其余的回车键。

Answer 2

有同样的问题，但发现这是因为我在表单上有一个 .preventDefault() - 最初是为了防止输入提交表单。

this.$el.keypress(function(e){
    if(e.which === 13){
        e.preventDefault();
    }
}

13 是输入的按键代码

Answer 3

就我而言，问题是由于使用了 White-Space: normal。当我删除它时，问题就消失了。

Answer 4

我以前从未听说过这样的事情，但我猜这与

display:inline;

有关

当元素包含文本区域之类的内容时，这不应该是有效的。

我建议将其更改为

display:inline-block;

。 might 足以修复它。但无论哪种方式，它绝对是您正在做的事情的正确显示类型。

Answer 5

除了文本区域的结束标记外，您的代码是正确的：

</textarea>

Answer 6

$('#Body').keypress(function(e) {
  if (e.keyCode == 13) {
    e.preventDefault();
    this.value = this.value.substring(0, this.selectionStart) + "" + "\n" + this.value.substring(this.selectionEnd, this.value.length);
  }
});

Answer 7

一些答案提到了

preventDefault

方法，但不要将搜索限制在该方法上，因为其他 JavaScript 也可能是罪魁祸首。

例如，您可能有一个类似于此的表单元素：

<form onkeydown="return event.keyCode != 13">

这将导致 all

TextAreas

在表单上忽略 Enter 键。

这将我们带到另一点：通过在同一页面或另一页面上创建另一个准系统

TextArea

来减少问题，以查看它是否表现出相同的问题。这样做通常有助于缩小原因范围。