首页 > 代码库 > 正则式表单验证
正则式表单验证
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<style>
form{
width: 350px;
height: 400px;
background-color:#FAEBD7;
position: absolute;
top: 50%;
left: 50%;
margin-top: -175px;
margin-left: -200px;
font-size:14px;
line-height: 60px;
}
#div1{
margin-top: 50px;
}
span{
display:inline-block;
width:100px;
height:20px;
text-align:right;
}
#denglu{
position: absolute;
bottom: 30px;
left: 90px;
font-size: 14px;
}
#reset{
position: absolute;
bottom: 30px;
left: 180px;
font-size: 14px;
}
a{
text-decoration: none;
}
</style>
</head>
<body>
<form action="" method="get" name="myform" onsubmit="return get()">
<div id="div1">
<span>用户名：</span>
<input class="a" type="text" name="username" placeholder="请输入用户名" />
</div>
<div>
<span>密码：</span>
<input class="a" type="password" name="pwd" placeholder="请输入密码" />
</div>
<div>
<span>手机号：</span>
<input type="text" name="tel" placeholder="请输入手机号" />
</div>
<div>
<span>邮箱：</span>
<input type="text" name="email" placeholder="请输入邮箱" />
</div>
<div>
<span>用户协议：</span>
<input onclick="agreeAction()" type="checkbox" name="xuanze[]" />
<a href=http://www.mamicode.com/"#">用户协议</a>
<input type="hidden" name="agree" id="agree" value=http://www.mamicode.com/"0"/>
</div>
<div>
<input id="denglu" type="submit" value=http://www.mamicode.com/"登录" />
<input id="reset" type="reset" />
</div>
</form>
<script>
var ob=/^[\d \w _]{6,12}$/
var ob1=/^[\d \w _]{6,20}$/
var ob2=/^1[3578]\d{9}$/
var ob3=/^[\d]{8,11}@qq.com$/
function agreeAction(){
var agree = document.getElementById(‘agree‘).value;
if(agree == 0){
document.getElementById(‘agree‘).value = http://www.mamicode.com/1;
}else{
document.getElementById(‘agree‘).value = http://www.mamicode.com/0;
}
}
function get(){
var name=document.myform.username.value;
var pwd=document.myform.pwd.value;
var tel=document.myform.tel.value;
var email=document.myform.email.value;
if(name==""){
alert(‘请输入用户名‘);
document.myform.username.focus();
return false;
}
else if(!ob.test(name)){
alert(‘账号输入不正确请重新输入‘);
}
if(pwd==""){
alert(‘请输入密码‘);
document.myform.pwd.focus();
return false;
}else if(!ob1.test(pwd)){
alert(‘密码输入不正确请重新输入‘);
}
if(tel==""){
alert(‘请输入手机号‘);
document.myform.tel.focus();
return false;
}else if(!ob2.test(tel)){
alert(‘手机号输入不正确请重新输入‘);
}
if(email==""){
alert(‘请输入邮箱‘);
document.myform.email.focus();
return false;
}else if(!ob3.test(email)){
alert(‘邮箱输入错误请重新输入‘)
}
var agree = document.getElementById(‘agree‘).value;
if(agree == 0){
alert(‘请阅读并且同意用户协议‘);
return;
}
alert(‘数据正确，可以提交‘);
}
</script>
</body>
</html>
正则式表单验证
声明：以上内容来自用户投稿及互联网公开渠道收集整理发布，本网站不拥有所有权，未作人工编辑处理，也不承担相关法律责任，若内容有误或涉及侵权可进行投诉： 投诉/举报 工作人员会在5个工作日内联系你，一经查实，本站将立刻删除涉嫌侵权内容。