原始js---JavaScript注册用正则验证用户名密码手机号邮箱验证码

注册文件 reg.html

<html>
<style>
　　#btn{
　　　　background-color: red;
　　　　color:white;
　　　　width: 235px;
　　　}
　　span{
　　　　color: red;
　　}
</style>
<center>
　　<form action="doreg.php" method="post" >
　　<table>
　　　　<tr>
　　　　　　<td>用户名</td>
　　　　　　<td>
　　　　　　　　<input type="text" name="username" onblur="check_user()">
　　　　　　　　<span id='username'></span>
　　　　　　</td>
　　　　</tr>
　　　　<tr>
　　　　　　<td>密码</td>
　　　　　　<td>
　　　　　　　　<input type="password" name="pwd" onblur="check_pwd()">
　　　　　　　　<button onclick="return showpwd()">显示密码</button>
　　　　　　　　<span id='pwd'></span>
　　　　　　</td>
　　　　</tr>
　　　　<tr>
　　　　　　<td>确认密码</td>
　　　　　　<td><input type="password" name="repwd" onblur="check_repwd()">
　　　　　　<span id='repwd'></span>
　　　　　　</td>
　　　　</tr>
　　　　<tr>
　　　　　　<td>手机号</td>
　　　　　　<td>
　　　　　　　　<input type="text" name="tel" onblur="check_tel()">
　　　　　　　　<span id='tel'></span>
　　　　　　</td>
　　　　　　</tr>
　　　　　　<tr>
　　　　　　　　<td>验证码</td>
　　　　　　　　<td>
　　　　　　　　　　<input type="code" name="code">
　　　　　　　　　　<button onclick="return reflush()">刷新验证码</button>
　　　　　　　　　　<span id='code'></span>
　　　　　　　　</td>
　　　　　　</tr>
　　　　</table>
　　　　<input type="checkbox" name="agree">我已阅读并同意 <br>
　　　　<button id="btn" onclick="return checkall()">立即注册</button>
　　</form>
</center>
</html>
<script>
// 验证码
　　window.onload=function(){
　　　　reflush();
　　}
　　function reflush(){
　　　　var randnum = 1000+Math.floor(Math.random()*9000)
　　　　document.getElementById('code').innerHTML=randnum;
　　　　return false;
　　}
// 显示密码
　　function showpwd(){
　　　　node = document.getElementsByName('pwd')[0];
　　　　node.type = "text";
　　　　return false;
　　}
// 验证用户名
　　function check_user() {
　　　　var username = document.getElementsByName('username')[0].value;
　　　　var ptn_username = /^[(\u4e00-\u9fa5)||\w]{6,10}$/i;
　　　　if (!username.match(ptn_username)) {
　　　　　　document.getElementById('username').innerHTML='用户名格式不正确';
　　　　　　return false;
　　　　}
　　　　document.getElementById('username').innerHTML='';
　　　　return true;
　　}
// 验证密码
　　function check_pwd() {
　　　　var pwd = document.getElementsByName('pwd')[0].value;
　　　　var ptn_pwd = /^\w{6,10}$/i;
　　　　if (!pwd.match(ptn_pwd)) {
　　　　　　document.getElementById('pwd').innerHTML='密码格式不正确';
　　　　　　return false;
　　　　}
　　　　document.getElementById('pwd').innerHTML='';
　　　　return true;
　　}
// 两次密码一致
　　function check_repwd(){
　　　　var pwd = document.getElementsByName('pwd')[0].value;
　　　　var repwd = document.getElementsByName('repwd')[0].value;
　　　　if (pwd!=repwd) {
　　　　　　document.getElementById('repwd').innerHTML='两次密码不一致';
　　　　　　return false;
　　　　}
　　　　document.getElementById('repwd').innerHTML='';
　　　　return true;
　　}
// 验证手机号
　　function check_tel() {
　　　　var tel = document.getElementsByName('tel')[0].value;
　　　　var ptn_tel = /^1[35789]\d{9}$/i;
　　　　if (!tel.match(ptn_tel)) {
　　　　　　document.getElementById('tel').innerHTML='手机号格式不正确';
　　　　　　return false;
　　　　}
　　　　document.getElementById('tel').innerHTML='';
　　　　return true;
　　}
// 阅读协议
　　function check_agree(){
　　　　var flag = document.getElementsByName('agree')[0].checked;
　　　　if(!flag){
　　　　　　alert('请先阅读注册说明书');
　　　　}
　　　　return flag;
　　}

// 刷新产生验证码
　　function check_code(){
　　　　var code = document.getElementsByName('code')[0].value;
　　　　var span_code = document.getElementById('code').innerHTML;
　　　　if (!code) {
　　　　　　alert('请点击刷新生成验证码')
　　　　}
　　　　if (code!=span_code) {
　　　　　　alert('验证码不正确')
　　　　　　return false;
　　　　}
　　　　return true;
　　}

// 表单提交
　　function checkall(){
　　　　var check = check_code()&&check_user()&&check_pwd()&&check_repwd()&&check_tel()&&check_agree();
　　　　return check;
　　}
</script>

巴特西

原始js---JavaScript注册用正则验证用户名密码手机号邮箱验证码

最新文章

热门文章