<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
<div>
<h3>用户注册</h3>
<p>用户名: <input type="text" id="myname"/></p>
<p>密码: <input type="password" id="pwd" /></p>
<p>确认密码:<input type="password" id="repwd" /></p>
<p>验证码: <input type="text" id="mycord" /></p>
<button type="button" id="sub" style="width:80px;height:50px;">提交</button>
</div>
<script type="text/javascript">
var myname = document.getElementById('myname');
var pwd = document.getElementById('pwd');
var repwd = document.getElementById('repwd');
var mycord = document.getElementById('mycord');
var sub = document.getElementById('sub');
// var nameValue =myname.value;
sub.onclick = function() {
var nameValue =myname.value;
var pwdValue = pwd.value;
var repwdValue = repwd.value;
var cordValue = mycord.value;//获取值要放在事件内,函数
if (nameValue != '') {
if (pwdValue != '') {
if (pwdValue == repwdValue) {
if (cordValue != '') {
alert('提交成功');
} else {
alert('验证码不能为空');
}
} else {
alert('确认密码不一致');
}
} else {
alert('密码不能为空');
}
} else {
alert('用户名不能为空');
}
}
</script>
</body>
</html>
js案例——简易表单验证
最新推荐文章于 2021-12-25 14:30:44 发布