下面的示例是否意味着表单将提交两次?
<form name="myForm" action="demo_form.asp" onsubmit="submitForm();" method="post">
function submitForm(){
document.myForm.submit();
}
我有一个错误,有时会记录每条记录中的两个。我怀疑它是因为表单提交了两次
最佳答案
表单元素上的
onsubmit=""定义事件函数。返回值(如果已定义)将被传回浏览器。虚假值(false、null、未定义等)将阻止浏览器继续提交表单。
它与任何其他功能类似
function isValid(form) {
if (someBadCondition) {
// record some error somewhere
return false;
}
if (someHorribleCondition || someEquallyBadCondition) {
// record some other error
return false;
}
return true;
}
function canSubmitForm(form) {
isValid(form);
}
最后一行永远不会传回返回值。因此
console.log(isValid(someForm)); // true
console.log(canSubmitForm(someForm)); // undefined
将 onsubmit="submitForm()"视为您的 canSubmitForm。实际上就是这样。无论您在 onsubmit=""中定义什么,都会被评估为一个函数来回答“我们可以提交这个吗?”这个问题。
您可以像这样修复上面的示例:
function canSubmitForm(form) {
return isValid(form);
}
请注意,return 语句现在会将 isValid 的结果传递给 canSubmitForm 的调用者。
因此,两者的区别
onsubmit="submitForm();"
和
onsubmit="return submitForm();"
就是前者中,submitForm的返回值被忽略了。在后面的例子中,如果submitForm要返回一个值,它将被传递给onsubmit的调用者,即浏览器。
您很可能提交表单两次,因为您的代码显示“提交表单时,请提交表单”。
如果submitForm javascript函数需要拥有提交过程(常见于ajax w/优雅降级),那么您需要在事件处理程序中添加return false。
onsubmit="submitForm(); return false"
或者更改submitForm返回false,然后onsubmit传递它
onsubmit="return submitForm();"
function submitForm() {
// do some submission stuff
return false;
}
我推荐前者,您可以在事件处理程序中明确设置 false。原因是事件处理程序是需要 false 的原因。提交并不虚假。你并没有以某种方式失败或拒绝。 SubmitForm 应该专注于提交内容,并让您的事件处理程序处理浏览器事件处理内容。另外,它还对代码进行了一点防错。
关于javascript - onsubmit ="submitForm();"和 onsubmit ="return submitForm();"有什么区别,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/16483982/