JS简单表单验证
程序员文章站
2022-05-31 13:44:04
...
先上简略的效果图:
我只是简单的判断如果文本框为空,就弹出不能为空的警告框;
如果你们判断条件很多,可以多加一点~
拷代码环节:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>JS表单验证</title>
</head>
<body>
<div class="big">
<form action="" method="get">
<table>
<tr>
<td>会员名:</td>
<td><input type="text" id="vipName"/><br /></td>
</tr>
<tr>
<td>性别:</td>
<td>男<input type="radio" id="m" name="sex" checked="checked"/><br /></td>
<td>女<input type="radio" id="w" name="sex"/><br /></td>
</tr>
<tr>
<td>密码:</td>
<td><input type="password" id="password" /><br /></td>
</tr>
<tr>
<td>电子邮件地址:</td>
<td><input type="email" id="e" /><br /></td>
</tr>
<tr>
<td>年龄:</td>
<td><input type="text" id="nl" /><br /></td>
</tr>
<tr>
<td>密码:</td>
<td><input type="password" id="password" /><br /></td>
</tr>
<tr>
<td></td>
<td ><button onclick="button_Register()">注册</button></td>
</tr>
</table>
</form>
</div>
</body>
<script type="text/javascript">
function button_Register(){
var name = document.getElementById("vipName").value;
var man = document.getElementById("m").value;
var woman = document.getElementById("w").value;
var pwd = document.getElementById("password").value;
var email = document.getElementById("e").value;
var age = document.getElementById("nl").value;
// window.alert(name);
if(name==""){
alert("用户名不能为空!");
}else if(man==""&&woman==""){
alert("性别不能为空!");
}else if(pwd==""){
alert("密码不能为空!");
}else if(pwd.length<6){
alert("密码不能小于6位数!");
}else if(email==""){
alert("邮箱不能为空!");
}else if(age==""){
alert("年龄不能为空!");
}else{
alert("信息输入正确");
}
}
</script>
</html>
我是与其终,一个风起云涌的女孩子。
很高兴你能看到我的博客,希望能对你有所帮助。
上一篇: js-记住之前选中的checkbox