我在一个网站上有一个调查,用户按下回车键(我不知道为什么),不小心没有点击提交按钮就提交了调查(表单),这似乎有些问题。有办法防止这种情况吗?
我在调查中使用HTML, PHP 5.2.9和jQuery。
我在一个网站上有一个调查,用户按下回车键(我不知道为什么),不小心没有点击提交按钮就提交了调查(表单),这似乎有些问题。有办法防止这种情况吗?
我在调查中使用HTML, PHP 5.2.9和jQuery。
当前回答
如果使用Vue,使用以下代码来阻止用户通过按Enter提交表单:
<form @submit.prevent>...</form>
其他回答
您可以使用一种方法,例如
$(document).ready(function() {
$(window).keydown(function(event){
if(event.keyCode == 13) {
event.preventDefault();
return false;
}
});
});
在阅读原文的评论时,为了让它更有用,并允许人们在填写完所有字段后按Enter:
function validationFunction() {
$('input').each(function() {
...
}
if(good) {
return true;
}
return false;
}
$(document).ready(function() {
$(window).keydown(function(event){
if( (event.keyCode == 13) && (validationFunction() == false) ) {
event.preventDefault();
return false;
}
});
});
我还不能评论,所以我会发布一个新的答案
接受的答案是ok-ish,但它不是停止提交在numpad进入。至少在当前版本的Chrome中是这样。我不得不改变这个键码条件,然后它工作。
if(event.keyCode == 13 || event.keyCode == 169) {...}
为了阻止表单被提交,我必须捕获所有与按下键相关的三个事件:
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(); }
});
没有提交按钮也行。只需在输入(type=button)中放入一个脚本,如果希望它提交表单中的数据,则添加eventListener。
而是使用这个
<input type="button" onclick="event.preventDefault();this.closest('form').submit();">
而不是用这个
<input type="submit">
注意:这里需要onclick在点击时实际提交表单。默认情况下,type="button"不足以提交。
在我的情况下,我有一对jQuery UI自动完成字段和文本区域的形式,所以我肯定希望他们接受进入。所以我从表单中删除了type="submit"输入,并添加了一个锚<a href="" id="btn">Ok</a>。然后我把它设置为一个按钮,并添加以下代码:
$( '#btn' ).click( function( event ){
event.preventDefault();
if ( validateData() ){
$( 'form#frm' ).append( '<input type="submit" id="frm-submit" style="display:none;"></input>' );
setTimeout( function(){ $( '#frm-submit' ).click(); }, 500 );
}
return false;
});
如果用户填写了所有必需的字段,validateData()将成功并提交表单。