js的提交表单统一验证
时间: 2023-10-06 19:07:05 浏览: 72
JS通用表单验证
4星 · 用户满意度95%
在前端中,可以使用JavaScript来进行表单验证。下面是一个简单的表单提交验证的示例代码:
```html
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>表单提交验证</title>
<script>
function validateForm() {
var name = document.forms["myForm"]["name"].value;
var email = document.forms["myForm"]["email"].value;
var password = document.forms["myForm"]["password"].value;
if (name == "") {
alert("请输入用户名");
return false;
}
if (email == "") {
alert("请输入邮箱");
return false;
}
if (password == "") {
alert("请输入密码");
return false;
}
}
</script>
</head>
<body>
<form name="myForm" onsubmit="return validateForm()" method="post">
<label>用户名:</label>
<input type="text" name="name"><br><br>
<label>邮箱:</label>
<input type="text" name="email"><br><br>
<label>密码:</label>
<input type="password" name="password"><br><br>
<input type="submit" value="提交">
</form>
</body>
</html>
```
在这个示例中,我们使用了一个`validateForm()`函数来进行表单验证。在函数中,我们获取了表单中的用户名、邮箱和密码,并进行了非空验证。如果有任何一个字段为空,则会弹出一个提示框,提示用户输入相应的内容,并返回`false`,阻止表单提交。如果所有字段都有值,则返回`true`,表单提交成功。
你可以按照这个示例来编写自己的表单提交验证代码,根据实际需求添加更多的验证规则。
阅读全文