js验证bbb123

最新推荐文章于 2022-05-05 15:38:29 发布

twtxby

最新推荐文章于 2022-05-05 15:38:29 发布

阅读量1.3k

点赞数

本文链接：https://blog.csdn.net/xiaozi_01anfen/article/details/78996669

版权

<!DOCTYPE html>
<html>

<head>
<meta charset="UTF-8">
<title></title>
<style>
form {
width: 700px;
margin: 0 auto;
}
label {
display: block;
margin: 10px;
}

</style>
<script src="js/jquery-1.11.1.js"></script>
<script>
var f_uname,f_pwd,f_pwd2,f_nick,f_birth;
function reg(){
var $uname=$("#uname").val();
var reg_uname=/^[0-9 a-z A-Z]{1,}$/;
if(reg_uname.test($uname)){
$("#t_uname").text("√");
$("#t_uname").css("color","green");
f_uname=true;
}else{
$("#t_uname").text("用户名或密码错误");

$("#t_uname").css("color","red");
f_uname=false;
}

var $pwd=$("#pwd").val();
var reg_pwd=/^[A-Z][0-9 a-z A-Z]{0,}$/;
if(reg_pwd.test($pwd)){
$("#t_pwd").text("√");
$("#t_pwd").css("color","green");
f_pwd=true;
}else{
$("#t_pwd").text("密码格式错误");

$("#t_pwd").css("color","red");
f_pwd=false;
}

if(f_uname&&f_pwd){
return true;
}else{
return false;
}

}

</script>
</head>

<body>
<form οnsubmit="return reg()" action="http://www.baidu.com">
<fieldset>
<legend>注册</legend>
<label>
用户名: <input id="uname" /><span id="t_uname"></span>
</label>
<label>
密码: <input id="pwd" /><span id="t_pwd"></span>
</label>
<label>
重复密码: <input id="pwd2" />
</label>
<label>
昵称: <input id="nick" />
</label>
<label>
出生日期: <input id="birth" type="date" />
</label>
<label>
性别: <input name="sex" type="radio" value="汉子" checked="checked" />汉子
<input name="sex" type="radio" value="妹子" />妹子
</label>

<input type="submit" value="注册" />
<input type="reset" value="重置" />
</fieldset>
</form>
</body>

</html>