<!doctype html><html lang="en"><head><meta charset="UTF-8"><title>网易新用户注册页面</title><link rel="stylesheet" href="css/register.css" /><style type="text/css">/*当鼠标放到文本框时，提示文本的样式*/.import_prompt{border:solid 1px #ffcd00;background-color:#ffffda;padding-left:5px;padding-right:5px;line-height:20px;}/*当文本框内容不符合要求时，提示文本的样式*/.error_prompt{border:solid 1px #ff3300;background:#fff2e5 url(../images/li_err.gif)5px 2px no-repeat;padding:2px 5px 0px 25px;line-height:20px;}/*当文本框内容输入正确时，提示文本的样式*/.ok_prompt{border:solid 1px #01be00;background:#e6fee4 url(../images/li_ok.gif) 5px 2px no-repeat;padding:2px 5px 0px 25px;line-height:20px;}</style></head><body><div id="header"><img src="images/register_logo.gif" alt="logo"/></div><div id="main"><form id="registerForm" action="" method="post" name="myform"><dl><dt>通行证用户名：</dt><dd><input type="text" id="userName" class="inputs userWidth"/> @</dd><dd><div id="userNameId"></div></dd></dl><dl><dt>登录密码：</dt><dd><input type="password" id="pwd" class="inputs"/></dd><dd><div id="pwdId"></div></dd></dl><dl><dt>重复登录密码：</dt><dd><input type="password" id="repwd" class="inputs"/></dd><dd><div id="repwdId"></div></dd></dl><dl><dt>性别：</dt><dd><input name="sex" type="radio" value="" checked="checked"/>男 <input name="sex" type="radio" value="" />女 </dd></dl><dl><dt>昵称：</dt><dd><input type="text" id="nickName" class="inputs"/></dd><dd><div id="nickNameId"></div></dd></dl><dl><dt>关联手机号：</dt><dd><input type="text" id="tel" class="inputs"/></dd><dd><div id="telId"></div></dd></dl><dl><dt>保密邮箱：</dt><dd><input type="email" id="email" class="inputs"/></dd><dd><div id="emailId"></div></dd></dl><dl><dt></dt><dd><input name=" " type="image" src="images/button.gif"/></dd></dl></form></div><script type="text/javascript" src="js/jquery-1.12.4.js"></script><script type="text/javascript">$(document).ready(function() {//失去焦点时，开始验证$("#userName").blur(checkUser); $("#pwd").blur(checkPwd); $("#repwd").blur(checkRepwd); $("#nickName").blur(checkNick); $("#tel").blur(checkTel);$("#email").blur(checkEmail);//提交表单$("form").submit(function(){var flag=true;if(!checkUser()) flag=false;if(!checkPwd()) flag=false;if(!checkRepwd()) flag=false;if(!checkNick()) flag=false;if(!checkTel()) flag=false;if(!checkEmail()) flag=false;if(!checkSex()) flag=false;return flag;});});//验证邮箱function checkEmail(){var email=$("#email").val().trim();var regemail=/^\w+@\w+(.[a-zA-Z]{2,3}){1,2}$/; //正则表达式if(regemail.test(email)==false){$("#emailId").addClass("error_prompt").removeClass("ok_prompt");$("#emailId").html("请输入您常用的电子邮箱");return false;}else{$("#emailId").addClass("ok_prompt").removeClass("error_prompt");$("#emailId").html("邮箱输入正确");return true;}}//验证手机号function checkTel(){var tel=$("#tel").val().trim();var regtel=/^(13|15|18)[0-9]{9}$/;if(regtel.test(tel)==false){$("#telId").addClass("error_prompt").removeClass("ok_prompt");$("#telId").html("手机号只能是以13、15、18开头的11位数字");}else{$("#telId").addClass("ok_prompt").removeClass("error_prompt");$("#telId").html("手机号输入正确");}}//验证昵称function checkNick(){var nick=$("#nickName").val().trim();var regnick=/^([\u4e000-\u9fa5]|\w|[@!#$%*])+$/;var len=nick.replace("/[\u4e000-\u9fa5]/g","xx").length;//计算字符串长度，一个汉字表示2个字符if(regnick.test(nick)==false){$("#nickNameId").addClass("error_prompt").removeClass("ok_prompt");$("#nickNameId").html("昵称由汉字、字母、数字、下划线，<br/>以及@、！、#、$、%\*等特殊字符组成，长度为4-20个字符");}else if(len<4||len>20){$("#nickNameId").addClass("error_prompt").removeClass("ok_prompt");$("#nickNameId").html("昵称长度为4-20个字符");}else{$("#nickNameId").addClass("ok_prompt").removeClass("error_prompt");$("#nickNameId").html("昵称输入正确");}}//验证用户名function checkUser(){var user=$("#userName").val().trim();var reguser=/^[a-zA-Z0-9](\w|.|-){2,16}[a-zA-Z0-9]$/;if(reguser.test(user)==false){$("#userNameId").addClass("error_prompt").removeClass("ok_prompt");$("#userNameId").html("1、由字母、数字、下划线、点、减号组成<br/>2、只能以数字、字母开头或结尾，组长度为4-18");}else{$("#userNameId").addClass("ok_prompt").removeClass("error_prompt");$("#userNameId").html("用户名输入正确");}}//验证密码function checkPwd(){var pwd=$("#pwd").val().trim();var regpwd=/^[0-9a-zA-Z]{4,18}$/;if(regpwd.test(pwd)==false){$("#pwdId").addClass("error_prompt").removeClass("ok_prompt");$("#pwdId").html("密码由英文字母和数字组成的4-18位字符");return false;}else{$("#pwdId").addClass("ok_prompt").removeClass("error_prompt");$("#pwdId").html("密码输入正确");return true;}}//确认密码function checkRepwd(){var pwd=$("#pwd").val().trim();var repwd=$("#repwd").val().trim();if(pwd==""){$("#repwdId").html("");return false;}if(repwd!=pwd){$("#repwdId").addClass("error_prompt").removeClass("ok_prompt");$("#repwdId").html("两次密码输入不一致");return false;}else{$("#repwdId").addClass("ok_prompt").removeClass("error_prompt");$("#repwdId").html("输入正确");return true;}}//验证性别function checkSex(){var sex=$("[name=sex]:checked").val();if(sex==null){$("#sexId").css("color","#F00");alert("请选择性别");return false;}else{return true;}}</script></body></html>
