注册正则表达式的运用

最新推荐文章于 2023-05-11 21:57:11 发布

sunstubble

最新推荐文章于 2023-05-11 21:57:11 发布

阅读量754

点赞数 2

分类专栏： Jquery

本文链接：https://blog.csdn.net/sunstubble/article/details/57415240

版权

Jquery 专栏收录该内容

7 篇文章 0 订阅

订阅专栏

HTML代码:

<!DOCTYPE html PUBLIC "-//W3C//Ddiv XHTML 1.0 divansitional//EN" "http://www.w3.org/div/xhtml1/Ddiv/xhtml1-divansitional.ddiv">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta content="text/html; charset=utf-8" http-equiv="Content-Type">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title>沈阳科技局-注册页面</title>
<meta name="keywords" content="沈阳科技局">
<meta name="description" content="沈阳科技局">
<meta name="renderer" content="webkit">
<link rel="stylesheet" type="text/css" href="/${res}/css/index.css">
<link href="/${res}/css/owl.carousel.css" rel="stylesheet" type="text/css" />
<link href="/${res}/css/owl.theme.css" rel="stylesheet" type="text/css" />
<script src="/${res}/js/jquery-1.10.1.min.js"></script>
<script src="/${res}/js/owl.carousel.min.js"></script>
<script src="/${res}/js/indexPage.js"></script>
<script src="/${res}/js/sendSms.js"></script>
<script src="/${res}/js/regist.js"></script>
<script src="/${res}/plugin/layui/layui.js"></script>
</head>
<script type="text/javascript">
[#--改变个人注册和公司注册--]
function change(span, next, type) {
	$(span).removeClass("com_login");
	$(span).addClass("personal_login");
	$("input[name=userType]").val(type);
	if(next) {
		$(span).next("span").removeClass("personal_login");
		$(span).next("span").addClass("com_login");
	} else {
		$(span).prev("span").removeClass("personal_login");
		$(span).prev("span").addClass("com_login");
	}
}
</script>
<body>
<div class="login_img">
	<div class="registerbox">
		<div class="login">
			<div class="login_header">
				<span class="fl" style="font-size:18px;">沈阳市中小微企业科技服务平台|注册</span>
				<span class="fr" style="font-size:14px;">已有注册账号，请<a style="color:#168AD5;" href="login.jspx">登录</a></span>
				<div class="clear"></div>
			</div>
			<div class="login_content">
				<div class="login_title">
					<span class="empty_login">个人注册</span><span class="personal_login" οnclick="change(this, true, 1);">企业注册</span><span class="com_login" οnclick="change(this, false, 2);">个人注册</span><span class="empty_login">个人注册</span>
					<form id="registform" method="post" οnsubmit="return check();" action="/micro/register.jspx">
						<div class="login_items">
							<span>账号：</span>
							<input id="username" name="username" οnblur="CheckUserName(this)"></input>
						</div>
						<div id="uName" style="text-align: center;background: blue;"></div>
						<div class="login_items">
							<span>密码：</span>
							<input id="password" name="password" οnblur="CheckPassword(this);"></input>
						</div>
						<div id="uPass" style="text-align: center;background: blue;"></div>
						<div class="login_items">
							<span>确认密码：</span>
							<input id="rpassword" name="rpassword" οnblur="CheckrePassword(this);"></input>
						</div>
						<div id="urPass" style="text-align: center;background: blue;"></div>
						<div class="login_items">
							<span>邮箱：</span>
							<input id="email" name="email" οnblur="CheckEmail(this);" οnblur="CheckUserName(this);"></input>
						</div>
						<div id="em" style="text-align: center;background: blue;"></div>
						<div class="login_items2">
							<span>手机号码：</span>
							<input id="mobile" name="mobile" οnblur="CheckMobile(this);"></input>
							<span id="ssendSms" class="login_login" style="text-align:center;cursor: pointer" οnclick="sendResetVerifyCode2()">获取验证码</span>
						</div>
						<div id="mb" style="text-align: center;background: blue;"></div>
						<div class="login_items">
							<span>验证码：</span><input id="ptSms" name="ptSms"></input>
						</div>
						<div class="clear"></div>
						<div style="text-align:center;">
							<span class="login_login" style="cursor: pointer;" οnclick="checkSmsRegister()">提交</span>
						</div>
						<input id="typeid" type="hidden" name="userType" value="1">
					</form>
				</div>
			</div>
			<input id="checkSms" type="hidden">
		</div>
	</div>
</div>
[#include "../include/footer.html" /]
</body>
</html>

js代码

function CheckUserName(){
	var username=$("#username").val();
	//正则表达式验证
	var reg=/^[a-zA-Z0-9]{3,10}$/;
	var res=reg.test(username);
	var flag;
	if(!res){
		$("#uName").show();
		$("#uName").html("用户名只能是3-10个字符,并且只能是英文字母或数字");
		return false;
	}else{
		$("#uName").hide();
		$.ajax({
			type:"post",
			dataTyep:"json",
			async: false,
			url:"check_username.jspx",
			data:{
				username:username
			},
			success : function(result) {
				if (result.result == 0) {
					$("#uName").show();
					$("#uName").html("用户名已经使用");
					flag = false
				} else {
					$("#uName").hide();
					flag = true
				}
			}
		})
		return flag
	}
}
//验证电子邮箱
function CheckEmail(){
	var email=$("#email").val();
	var reg= /^([a-zA-Z0-9_\.\-])+\@(([a-zA-Z0-9\-])+\.)+([a-zA-Z0-9]{2,4})+$/;
	var res=reg.test(email);
	var flag;
	if(!res){
		$("#em").show()
		$("#em").html("请输入正确的邮箱格式")
		return false
	}else{
		$("#em").hide()
		$.ajax({
			type : "post",
			dataType : "json",
			url : "email_unique.jspx",
			async: false,
			data : {
				email : email
			},
			success : function(result) {
					if(result.result == 0){
						$("#em").show()
						$("#em").html("邮箱已经存在在")
						flag = false
					}else{
						$("#em").hide()
						flag = true
					}
				}
		})
		return flag 
	}
}
//检查密码
function CheckPassword(){
	//只能是数字和字母,最多10位
	var  passWord=$("#password").val();
	if((""==passWord)||(null==passWord)){
		$("#uPass").show();
		$("#uPass").html("密码不能为空");
		return false;
	}else{
		//正则表达式验证
		var reg=/^[a-zA-Z0-9]{3,10}$/;
		var res=reg.test(passWord);
		if(!res){
			$("#uPass").show();
			$("#uPass").html("密码只能是3-10个字符,并且只能是英文字母或数字");
			return false;
		}else{
			$("#uPass").hide();
			return true;
		}
	}
}
//检查验证密码
function CheckrePassword(){
	//两次密码是否一致
	var rePassWord=$("#rpassword").val();
	var  passWord=$("#password").val();
	if(rePassWord!=passWord){
		$("#urPass").show()
		$("#urPass").html("两次密码输入不一致!")
		return false;
	}else{
		$("#urPass").hide();
		return true
	}
}


//验证手机
function CheckMobile(){
	var mobile=$("#mobile").val();
	var reg= /^1[3|4|5|7|8]\d{9}$/;
	var res=reg.test(mobile);
	var flag;
	if(!res){
		$("#mb").show()
		$("#mb").html("请输入正确的手机格式")
		return false;
	}else{
		$("#mb").hide()
		$.ajax({
			type : "post",
			dataType : "json",
			url : "mobile_unique.jspx",
			async: false,
			data : {
				mobile : mobile
			},
			success : function(result) {
					if (result) {
						$("#mb").hide()
						flag = true
					} else {
						$("#mb").show()
						$("#mb").html("手机号码已存在")
						flag = false
					}
				}
			})
		return flag
	}
}

//整体
function check(){
	if(CheckUserName()&&CheckPassword()&&CheckrePassword()&&CheckEmail()
			&&CheckMobile()){
		return true;
	}else{
		alert("请正确输入注册信息")
		return false;
	}
}
//确认验证码
function checkSmsRegister(){
	var checkSms=$("#checkSms").val();
	var putSms=$("#ptSms").val();
	if(checkSms!=""&&checkSms==putSms){
		$.post($("#registform").attr("action"), $("#registform").serialize(), function(result) {
			if(result.success) {
				layer.msg("注册成功！");
				setInterval("window.location.href = '/';", 1000);
				return ;
			}
			layer.msg("注册失败！", result.failedMessage);
		});
		///$("#registform").submit();
	}else{
		alert("验证码输入错误");
	}
}