按下任何文本框中的回车键会调用我的保存按钮单击事件？

Question

我有一个标准的asp.net webform，上面有多个文本框（Autopostback=False）和一个保存按钮。
在任何文本框中按ENTER键会导致调用保存按钮的服务器端单击事件。如果我断点并查看调用堆栈，单击事件是唯一列出的事件。我没有为表单设置默认按钮。
如果我在保存按钮上方放置另一个按钮，则在文本框上按Enter键时会调用它的单击事件。
你有什么想法为什么会发生这种情况，以及如何停止它？

- tbone

Answer 1

对于大多数字段，默认行为是这样的，除了文本区域。

要避免这种情况，您可以在提交表单之前调用JavaScript函数来检查按键。

<script type="text/javascript">
  function allowSubmission() {
  return !(window.event && window.event.keyCode == 13); }
</script>

那么提交表单的唯一方式就是实际点击“提交”按钮。然而，正如许多人提到的那样，按下回车键提交表单是预期的行为，因此您可以始终更改函数以对字段进行基本验证，如果所有必填字段都已填写，则允许回车键提交表单。

<script type="text/javascript">
  function allowSubmission() {
  return !(window.event && window.event.keyCode == 13) || validateInput(); }
</script>

编辑：您需要在提交按钮的OnClientClick方法中调用此函数。类似于：

<asp:Button id="SubmitBtn" runat="server" OnClientClick="return allowSubmission()"/>

- Brandon

---

如果我不是鼠标用户，想要通过按Tab键到达按钮并按Enter键，会发生什么？我知道我可以按空格键，但我敢打赌我的终端用户中有99%的人不会想到使用空格键... - Scott Ivey

只要表单验证通过，你就可以这样做。我没有编写validateInput函数，因为我不知道OP希望它做什么，但是如果您填写了必填字段，则检查将通过。 - Brandon

Answer 2

任何web表单都适用：如果在输入字段有焦点的情况下按enter键，表单将被提交（除了文本区域）。为了阻止这种情况发生，你需要一些JavaScript代码来捕获该事件并防止表单被提交。但请注意，对于许多用户来说，按enter键提交表单是预期行为！

- Matthew Groves

Answer 3

请确保您的文本框设置为多行文本模式，如果没有设置，按下回车键会执行命令按钮，从而导致页面提交。

<asp:TextBox ID="TextBox1" runat="server" TextMode="MultiLine"></asp:TextBox>

如果您不希望文本框多行，您可以在JavaScript中拦截按键命令，当输入回车时不执行任何操作。

以下是示例：

function hookUpToEnterKey()
{
    // Hook up to read enter key
    document.onkeydown = processEntryKey;
}

function processEntryKey(e)
{

    if( !e ) 
    {
        if( window.event ) 
        {
        //Internet Explorer
        e = window.event;
        } 
        else 
        {
        // Cannot get the even return.
        return;
        }
    }

    if( typeof( e.keyCode ) == 'number'  ) 
    {
        //DOM
        e = e.keyCode;
    } 
    else 
        if( typeof( e.which ) == 'number' ) 
        {
            //NS 4 compatible
            e = e.which;
        } 
        else 
            if( typeof( e.charCode ) == 'number'  ) 
            {
                //also NS 6+, Mozilla 0.9+
                e = e.charCode;
            } 
            else 
            {
                //total failure, we have no way of obtaining the key code
                return;
            }

      if(e == 13) 
      {
         // Do nothing
         return false;
      }
}

- David Basarab

---

不要忘记，许多人希望使用回车键提交表单。您应该在控件上实施客户端验证，以防止以未完成的状态提交表单。 - Scott Ivey

你是对的。我通常不这样做，但似乎提问者想要防止回车键执行任何操作。 - David Basarab

你说得对。实际上，理想情况下，我希望它执行一个制表符。 - tbone

Answer 4

我曾经遇到过完全相同的问题：我有一个数据绑定的网格视图、一个文本框和一个按钮。文本框用于过滤网格内容，作为搜索框。按钮用于完全不同的操作。在放置按钮之前，按下文本框上的回车键会导致网格被过滤，这是预期的行为。但是，一旦我放置了按钮，在文本框上聚焦时按下回车键会导致按钮的onclick事件被调用。我只需将文本框的autopostback属性设置为true即可解决此问题。我不明白为什么，但它以某种方式覆盖了文本框的表单提交行为。希望能帮到你。

- fabigato

---

我在按钮的onclick方法中打印一条消息（通过设置某个标签的文本属性）。当我在文本框上聚焦并按下回车键时，这条消息不会显示出来，因此，按下文本框上的回车键既不会导致浏览器也不会导致其他任何人点击该按钮。 - fabigato

我刚刚点了个赞。我并不完全同意使用这种技术，但用户描述了我的确切问题，并且解决方案有效。我尝试了多种方式拦截回车键，但只有这种方法成功了。只是想说声谢谢。 - Sean Anderson

Answer 5

你的浏览器试图为你点击按钮，即使你没有将它设置为“默认”（它将在输入时“点击”表单中的第一个按钮）。

就像David所说，如果你想让回车键在文本框中换行，它需要是多行的。

- John