阻止按钮在输入密钥上提交

Question

我有两个按钮，一个是id = enterToSubmit，另一个是id = clickToSubmit。 当用户点击enterkey时，我想要“enterToSubmit”按钮提交表单而不是“clickToSubmit”按钮。

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

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

Answer 1

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

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

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

所以也许你可以“隐藏”输入提交按钮，而不是让它消失，而是将它推出无法看到的页面，然后在其上捕获click事件以return false并停止提交表单。

Answer 2

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

尝试这个：

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

Answer 3

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

Answer 4

首先，您必须确保两个按钮都不是提交类型。 现在在这两个按钮上，您可以调用两个不同的JavaScript函数。 enterToSubmit（）和clickToSubmit（）也看到在enterToSubmit（）上你读了回车键

if（e.keyCode === 13）{form.submit（）; }

并调用form.submit（）

在clickToSubmit（）上你做一个直接的form.submit（）

Answer 5

尝试使用此代码输入文本框

$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;
   }
});

Answer 6

    $('#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中，表单提交不会被阻止，将keypress事件添加到表单也更安全。