javascript - onsubmit="submitForm();" 和有什么区别 和 onsubmit="return submitForm();"
表单元素上的 onsubmit="" 定义了一个事件函数。返回值(如果已定义)将被传递回浏览器。虚假值(false、null、undefined 等)将阻止浏览器继续进行表单提交。
它类似于任何其他功能
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 之类的东西),那么您需要在事件处理程序中添加 return false。
onsubmit="submitForm(); return false"
或更改 submitForm 以返回 false 然后 onsubmit 将其传递
onsubmit="return submitForm();"
function submitForm() {
// do some submission stuff
return false;
}
我推荐前者,在事件处理程序中放置一个显式的 false 。原因是事件处理程序是需要 false 的原因。提交不是假的。你没有以某种方式失败或拒绝。submitForm 应该专注于提交内容,让您的事件处理程序处理浏览器事件处理内容。此外,它还能对代码进行一些防错。