JS+jquery正则简易校验

最新推荐文章于 2022-11-02 20:22:55 发布

摘星_FF

最新推荐文章于 2022-11-02 20:22:55 发布

阅读量601

点赞数

文章标签： javascript html

本文链接：https://blog.csdn.net/qq_43462448/article/details/123803516

版权

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<title></title>
	</head>
	<body>
		<form action="购物车.html" id="regForm">
			<span>用户名</span>：<input type="text" name="username" reg="/^\w{5,10}$/" id="username" /> <span></span> <br />
			<span>密码</span>：<input type="password" name="pwd" reg="/^\w{5,10}$/" id="pwd" />
			<span></span> <br />
			<span>手机号</span>：<input type="text" name="phone"
				reg="/^(13[0-9]|14[5|7]|15[0|1|2|3|5|6|7|8|9]|18[0|1|2|3|5|6|7|8|9])\d{8}$/" id="phone" /> <span></span>
			<br />
			<span>身份证号</span>：<input type="text" name="idcard" reg="/^\d{8,18}|[0-9x]{8,18}|[0-9X]{8,18}?$/"
				id="idcard" /> <span></span> <br />

			<span>邮箱</span>：<input type="text" name="email" id="email"
				reg="/^\w+([-+.]\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*$/" /> <span></span> <br />
			<input type="button" value="注册" id="regBtn" /><br />
		</form>
		<script src="./jquery-3.5.0.min.js" type="text/javascript" charset="utf-8"></script>
		<script type="text/javascript">
		var jilu=true;
			$("input[type='text'],input[type='password']").blur(function(){//给所有文本框绑定失去焦点事件
				var a = this.value;//获取录入的内容
				if (a != "" && a != null && a != undefined) {
					var b=$(this).attr("reg")//attr函数  getAttribute setAttribute
					b=eval(b)
					if(b.test(a)){
						$(this).next().html("")
					}else{
						$(this).next().html("格式错误")
						jilu=false
					}
				}else{
					$(this).next().html("不能为空")
					jilu=false
				}
			})
			$("#regBtn").click(function(){
				jilu=true
				var inpqq=$("input[type='text'],input[type='password']");
				inpqq.each(function(){
					$(this).trigger("blur")//触发对象失去焦点的事件
				})
				// for(var i=0;i<inp.length;i++){
				// 	$(inp[i]).trigger('blur')
				// }
				if(jilu){
					$("#regForm").submit()
				}
			})
	    </script>
	</body>
</html>

简易代码，仅作参考，请勿其他用途

摘星_FF

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
JS+jquery正则简易校验

<!DOCTYPE html><html> <head> <meta charset="utf-8" /> <title></title> </head> <body> <form action="购物车.html" id="regForm"> <span>用户名</span>：<input type="text" name="use...
复制链接

扫一扫