通过按Enter阻止用户提交表单

您也可以javascript:void(0)用来阻止表单提交。

<form action="javascript:void(0)" method="post">
    <label for="">Search</label>
    <input type="text">
    <button type="sybmit">Submit</button>
</form>

<form action="javascript:void(0)" method="post">
    <label for="">Search</label>
    <input type="text">
    <button type="sybmit">Submit</button>
</form>

走进你的CSS，并添加到它，然后会自动阻止提交您的公式推的，只要你有提交的输入，如果你不再需要它，你可以将它删除或类型activate和deactivate替代

 input:disabled {
        background: gainsboro;
      }
      input[value]:disabled {
        color: whitesmoke;
      }

我认为所有答案都已涵盖其中，但是如果您使用带有一些JavaScript验证代码的按钮，则只需将表单的onkeypress设置为Enter即可按预期调用提交：

<form method="POST" action="..." onkeypress="if(event.keyCode == 13) mySubmitFunction(this); return false;">

onkeypress JS可能是您需要执行的任何操作。无需进行更大的全球变革。如果您不是一个从头开始编写应用程序的人，并且您已经被投入修复其他人的网站而无需拆开它并重新测试它，则尤其如此。

我有一个类似的问题，我有一个带有“ ajax文本字段”（Yii CGridView）的网格，并且只有一个提交按钮。每次我在文本字段上进行搜索，然后点击输入提交的表单。我必须对按钮做些事情，因为它是视图之间的唯一通用按钮（MVC模式）。我所要做的就是删除type="submit"并放置onclick="document.forms[0].submit()

您可以使用JavaScript方法检查是否已Enter按下键，如果已按下，则停止提交。

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

只需在Submit方法上调用它即可。

1. 不要将type =“ submit”用于输入或按钮。
2. 使用type =“ button”并使用js [Jquery / angular / etc]将表单提交到服务器。

不放置提交按钮可以。只需将脚本放入输入（类型=按钮）中，或添加eventListener（如果您希望它以表单形式提交数据）。

宁可使用这个

<input type="button">

比使用这个

<input type="submit">

完全不同的方法：

1. <button type="submit">按时将激活表格中的第一个Enter。
2. 即使按钮被隐藏了也是如此 style="display:none;
3. 该按钮的脚本可以返回false，从而中止提交过程。
4. 您仍然可以另外<button type=submit>提交表格。只需返回true即可层叠提交。
5. Enter聚焦真实提交按钮的同时按会激活真实提交按钮。
6. 按下Enter内部<textarea>控件或其他窗体控件将表现正常。
7. 按下Enter内部<input>窗体控件将触发first <button type=submit>，它返回false，因此什么也没有发生。

从而：

<form action="...">
  <!-- insert this next line immediately after the <form> opening tag -->
  <button type=submit onclick="return false;" style="display:none;"></button>

  <!-- everything else follows as normal -->
  <!-- ... -->
  <button type=submit>Submit</button>
</form>

我目前无法发表评论，因此我将发布一个新答案

接受的答案还可以，但是它并没有停止在numpad enter上提交。至少在当前版本的Chrome中。我不得不对此更改键码条件，然后它可以工作。

if(event.keyCode == 13 || event.keyCode == 169) {...}

Enter您可以保留原样并添加一些额外的客户端验证，而不是阻止用户按下（这看起来似乎是不自然的）：当调查未完成时，结果不会发送到服务器，并且用户会收到一条很好的消息，告诉您需要完成什么才能完成表格。如果您使用的是jQuery，请尝试验证插件：

http://docs.jquery.com/插件/验证

这比Enter按下按钮需要更多的工作，但是可以肯定的是它将提供更丰富的用户体验。

一个不错的简单jQuery小解决方案：

$("form").bind("keypress", function (e) {
    if (e.keyCode == 13) {
        return false;
    }
});

如果使用脚本执行实际的提交，则可以向onsubmit处理程序添加“ return false”行，如下所示：

<form onsubmit="return false;">

从JavaScript调用表单上的commit（）不会触发该事件。

W3C HTML5规范的第4.10.22.2节隐式提交说：

一个form元素的默认按钮是第一个提交按钮在树形结构顺序，其所属表单是form元素。

如果用户代理支持让用户隐式提交表单（例如，在某些平台上，当文本字段被集中隐式提交时，按下“ enter”键提交表单），则对默认按钮具有定义的激活的表单执行此操作行为必须导致用户代理在该默认按钮上运行综合点击激活步骤。

注意：因此，如果禁用了默认按钮，则使用这种隐式提交机制时不会提交表单。（禁用时，按钮没有激活行为。）

因此，禁用任何隐式提交表单的符合标准的方法是将禁用的提交按钮放置为表单中的第一个提交按钮：

<form action="...">
  <!-- Prevent implicit submission of the form -->
  <button type="submit" disabled style="display: none" aria-hidden="true"></button>

  <!-- ... -->

  <button type="submit">Submit</button>
</form>

这种方法的一个不错的功能是，它无需JavaScript就可以工作；无论是否启用JavaScript，都需要使用符合标准的Web浏览器以防止隐式表单提交。