通过按回车键阻止用户提交表单

我在一个网站上有一个调查，用户按下回车键(我不知道为什么)，不小心没有点击提交按钮就提交了调查(表单)，这似乎有些问题。有办法防止这种情况吗?

我在调查中使用HTML, PHP 5.2.9和jQuery。

当前回答

这是完美的方式，你不会从你的页面重定向

$('form input').keydown(function (e) {
if (e.keyCode == 13) {
    e.preventDefault();
    return false;
}
});

其他回答

如果你正在使用Alpine，你可以通过按Enter来阻止表单提交:

<div x-data>
  <form x-on:keydown.prevent.enter="">...</form>
</div>

或者，您可以使用.window修饰符在页面的根窗口对象而不是元素上注册事件侦听器。

<form>
  <div x-data>
    <input x-on:keydown.window.prevent.enter="" type="text">
  </div>
</form>

您可以创建一个JavaScript方法来检查是否按下了Enter键，如果按下了，就停止提交。

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

只需在submit方法上调用它。

不需要阻止用户按Enter键(这似乎不自然)，您可以让表单保持原样，并添加一些额外的客户端验证:当调查未完成时，结果不会发送到服务器，用户会收到一条漂亮的消息，告诉需要完成哪些内容才能完成表单。如果您正在使用jQuery，请尝试验证插件:

http://docs.jquery.com/Plugins/Validation

这将需要比捕捉Enter按钮更多的工作，但肯定会提供更丰富的用户体验。

这是我达到目标的解决方案，它干净有效。

$('form').submit(function () {
  if ($(document.activeElement).attr('type') == 'submit')
     return true;
  else return false;
});

我认为它很好地涵盖了所有的答案，但如果你正在使用一个带有JavaScript验证代码的按钮，你可以将表单的onkeypress设置为Enter来调用你的提交:

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

onkeypress JS可以是你需要做的任何事情。没有必要进行更大的全球性变革。如果你不是那个从头开始编写应用程序的人，而且你被请去修复别人的网站，而没有把它拆开并重新测试它，这就尤其正确。

推荐文章