<!DOCTYPE html>
<html>
<head> </head>
<body>
<!--使用onsubmit提交表单,并且button的type为submit时onsubmit属性的内容必须要有return关键字,否则函数拒绝执行,不会返回,并且表单会在不校验的情况下提交 -->
<form name="myForm" onsubmit="return validate()">
<input type="text" name="input">
<button type="submit">提交</button>
</form>
</body>
</html>
<script>
/* 表单校验函数必须返回一个布尔值 */
function validate() {
if (document.forms["myForm"]["input"].value == "") {
alert("表单不能为空")
return false
}
}
</script>
或者表单自身比进行提交,在校验函数中执行提交函数
<!DOCTYPE html>
<html>
<head> </head>
<body>
<!--使用onsubmit提交表单,并且button的type为submit时onsubmit属性的内容必须要有return关键字,否则函数拒绝执行,不会返回,并且表单会在不校验的情况下提交 -->
<form name="userForm" action="">
<input type="text" name="input">
<button type="button" onclick="validate()">提交</button>
</form>
</body>
</html>
<script>
/* 表单校验函数必须返回一个布尔值 */
function validate() {
if (document.forms["userForm"]["input"].value == "") {
alert("表单不能为空")
return;
}
let userForm = document.getElementsByName("userForm");
userForm.submit()
}
</script>