如何防止在基于web的应用程序中按ENTER键提交表单?
当前回答
我也遇到了同样的问题(表单包含大量的文本字段和不熟练的用户)。
我是这样解决的:
function chkSubmit() {
if (window.confirm('Do you want to store the data?')) {
return true;
} else {
// some code to focus on a specific field
return false;
}
}
在HTML代码中使用这个:
<form
action="go.php"
method="post"
accept-charset="utf-8"
enctype="multipart/form-data"
onsubmit="return chkSubmit()"
>
通过这种方式,ENTER键按计划工作,但需要确认(通常是第二次按ENTER键)。
我留给读者的任务是,如果用户决定继续使用表单,那么脚本会将用户发送到按ENTER的字段中。
其他回答
在我的案例中,这个jQuery JavaScript解决了这个问题
jQuery(function() {
jQuery("form.myform").submit(function(event) {
event.preventDefault();
return false;
});
}
stopSubmitOnEnter (e) {
var eve = e || window.event;
var keycode = eve.keyCode || eve.which || eve.charCode;
if (keycode == 13) {
eve.cancelBubble = true;
eve.returnValue = false;
if (eve.stopPropagation) {
eve.stopPropagation();
eve.preventDefault();
}
return false;
}
}
然后在表格上:
<form id="foo" onkeypress="stopSubmitOnEnter(e);">
不过,如果不使用突兀的JavaScript会更好。
防止“ENTER”提交表单可能会给一些用户带来不便。所以你最好按照下面的步骤来做:
在你的表单标签中写入'onSubmit'事件:
<form name="formname" id="formId" onSubmit="return testSubmit()" ...>
....
....
....
</form>
编写Javascript函数如下:
function testSubmit(){
if(jQuery("#formId").valid())
{
return true;
}
return false;
}
(OR)
不管是什么原因,如果你想阻止按Enter键提交表单,你可以用javascript写下面的函数:
$(document).ready(function() {
$(window).keydown(function(event){
if(event.keyCode == 13) {
event.preventDefault();
return false;
}
});
});
谢谢。
以下是我的做法:
window.addEventListener('keydown', function(event)
{
if (event.key === "Enter" && event.target.tagName !== 'TEXTAREA')
{
if(event.target.type !== 'submit')
{
event.preventDefault();
return false;
}
}
});
将这个标签添加到你的表单- onsubmit="return false;" 然后只能使用JavaScript函数提交表单。