防止按钮在输入键上提交答案

【问题标题】：Prevent a button to submit on enter key防止按钮在输入键上提交
【发布时间】：2010-11-02 06:48:37
【问题描述】：

我有两个按钮，一个是 id=enterToSubmit，另一个是 id=clickToSubmit。当用户按下回车键时，我希望“enterToSubmit”按钮提交表单而不是“clickToSubmit”按钮。

在同一页面上，我有一个文本框 id=title，在页面加载时我隐藏“enterToSubmit”按钮，直到用户在文本框中输入内容，然后用户可以按 Enter 键提交表单。

如何防止“clickToSubmit”按钮在用户按Enter键时提交？

【问题讨论】：

【解决方案1】：

很遗憾，您无法更改 HTML 中的“默认”提交按钮，它始终是第一个 input/button，类型为 submit/image。

虽然您可以尝试手动捕获 Enter keypress 事件，但这样做非常不可靠，因为 Enter 并不总是应该提交表单，这取决于 (a) 关注的元素类型，(b)是否使用 shift/ctrl+enter，(c) 表单中还有哪些其他元素，以及 (d) 它是什么浏览器。如果您错过了一个案例，您将获得意外的默认提交；如果您遇到了不该遇到的情况，您将获得意外的输入提交。

因此，一般来说，当您想要控制表单的默认提交操作时，最好在表单中添加一个额外的按钮作为第一个提交按钮。如果您不希望显示此按钮，可以将其定位为较大的负值 left 以将其推离页面一侧。（这有点难看，但是通过display 或visibility 隐藏它会阻止它在某些浏览器中运行。）

因此，也许您可以“隐藏”输入提交按钮，而不是让它消失，而是将其推离页面看不到的地方，然后将其上的 click 事件捕获到 @987654330 @ 并停止表单提交。

【讨论】：

【解决方案2】：

如何防止“clickToSubmit”按钮用户按 Enter 键时提交？

试试这个：

$("#clickToSubmit").on("keydown", function(e){
   if(e.keyCode === 13){
       e.preventDefault();
   }
});

【讨论】：

【解决方案3】：

    $('#formId').on('keyup keypress', function(e) {
          var keyCode = e.keyCode || e.which;
          if (keyCode === 13) { 
            e.preventDefault();
            return false;
          }
        });



Usually form is submitted on Enter when you have focus on input 
elements.
We can disable Enter key (code 13) on input elements within a form.

此外，在某些较新版本的 Firefox 中，表单提交不是防止，将按键事件添加到表单也更安全。

【讨论】：

对这段代码的一些解释可能会有所帮助。

【解决方案4】：

    jQuery('#clickToSubmit').click(function(e){    
       if(e.keyCode==13){          
            e.preventDefault();
       }    
    });

【讨论】：

【解决方案5】：

首先，您必须确保两个按钮都不是提交类型。现在，在这两个按钮上，您可以调用两个不同的 JavaScript 函数。 enterToSubmit() 和 clickToSubmit() 还看到，在 enterToSubmit() 上，您读取了 enter 键按下

如果（e.keyCode === 13）{ form.submit(); }

并调用 form.submit()

在 clickToSubmit() 上执行直接 form.submit()

【讨论】：

【解决方案6】：

试试这个代码输入文本框

$j("#title").keypress(function(e1){
   if(e1.keyCode==13){          // if user is hitting enter
       return false;
   }
});

提交按钮

$j("#clickToSubmit").submit(function(e1){
   if(e1.keyCode==13){          // if user is hitting enter
       return false;
   }
});

【讨论】：