我在一个网站上有一个调查,用户按下回车键(我不知道为什么),不小心没有点击提交按钮就提交了调查(表单),这似乎有些问题。有办法防止这种情况吗?
我在调查中使用HTML, PHP 5.2.9和jQuery。
我在一个网站上有一个调查,用户按下回车键(我不知道为什么),不小心没有点击提交按钮就提交了调查(表单),这似乎有些问题。有办法防止这种情况吗?
我在调查中使用HTML, PHP 5.2.9和jQuery。
当前回答
我还不能评论,所以我会发布一个新的答案
接受的答案是ok-ish,但它不是停止提交在numpad进入。至少在当前版本的Chrome中是这样。我不得不改变这个键码条件,然后它工作。
if(event.keyCode == 13 || event.keyCode == 169) {...}
其他回答
不要在输入或按钮中使用type="submit"。 使用type="button"并使用js [Jquery/angular/etc]向服务器提交表单。
第4.10.22.2节隐式提交的W3C HTML5规范说:
A form element's default button is the first submit button in tree order whose form owner is that form element. If the user agent supports letting the user submit a form implicitly (for example, on some platforms hitting the "enter" key while a text field is focused implicitly submits the form), then doing so for a form whose default button has a defined activation behavior must cause the user agent to run synthetic click activation steps on that default button. Note: Consequently, if the default button is disabled, the form is not submitted when such an implicit submission mechanism is used. (A button has no activation behavior when disabled.)
因此,一种符合标准的禁用表单隐式提交的方法是将禁用的提交按钮作为表单中的第一个提交按钮:
<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浏览器来防止隐式表单提交。
如果使用Vue,使用以下代码来阻止用户通过按Enter提交表单:
<form @submit.prevent>...</form>
您可以创建一个JavaScript方法来检查是否按下了Enter键,如果按下了,就停止提交。
<script type="text/javascript">
function noenter() {
return !(window.event && window.event.keyCode == 13); }
</script>
只需在submit方法上调用它。
为了阻止表单被提交,我必须捕获所有与按下键相关的三个事件:
var preventSubmit = function(event) {
if(event.keyCode == 13) {
console.log("caught ya!");
event.preventDefault();
//event.stopPropagation();
return false;
}
}
$("#search").keypress(preventSubmit);
$("#search").keydown(preventSubmit);
$("#search").keyup(preventSubmit);
你可以把上面所有的组合成一个漂亮的紧凑版本:
$('#search').bind('keypress keydown keyup', function(e){
if(e.keyCode == 13) { e.preventDefault(); }
});