资讯

精准传达 • 有效沟通

从品牌网站建设到网络营销策划，从策略到执行的一站式服务

网站建设 >

查看其它板块

JS怎么使用正则表达式判断输入框失去焦点事件

这篇文章主要介绍JS怎么使用正则表达式判断输入框失去焦点事件，文中介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们一定要看完！

网站建设、做网站的开发，更需要了解用户，从用户角度来建设网站，获得较好的用户体验。成都创新互联公司多年互联网经验，见的多，沟通容易、能帮助客户提出的运营建议。作为成都一家网络公司，打造的就是网站建设产品直销的概念。选择成都创新互联公司，不只是建站，我们把建站作为产品，不断的更新、完善，让每位来访用户感受到浩方产品的价值服务。

效果图

JS怎么使用正则表达式判断输入框失去焦点事件

项目的正则表达式规则

1:用户名: 大写字母开头 6-20位字符(不允许有符号但是允许有_)
2:密码 大写开头 数字字母符号混合 8-15位
3:确认密码 大写开头 数字字母符号混合 8-15位
4:邮箱 邮箱格式
5:手机号 手机号格式
6:身份证号 身份证号格式
7:地址 中文开头 数字 - 字母 中文混合

项目目录

JS怎么使用正则表达式判断输入框失去焦点事件

html代码

由于无法上传bootstrap.min.css
需要样式的需要前往官网下载
bootstrap中文网



	
		
		
		
		
	
	
		
			
				
					
正则表达式
用户名
密码 确认密码 邮箱 手机号 身份证号 地址 var ID = ""; function verify(ID) { //设置一个ID用来传参 switch (ID) { //根据传过来的input的"ID"判断进行不同的正则表达式验证 //用户名验证 case UserName: //用户名的正则表达式 var UserNameRule = /^[A-Z][a-zA-Z0-9_]{6,20}$/; //调用下面的编写的js方法,传入input的id和正则表达式 reg("UserName", UserNameRule); break; case pwd: //密码验证 var pwdRule = /^[A-Z][a-zA-Z0-9_]{8,15}$/; reg("pwd", pwdRule); break; case affirmPwd: //密码确认验证 var affirmPwdRule = /^[A-Z][a-zA-Z0-9_]{8,15}$/; reg("affirmPwd", affirmPwdRule); break; case email: //邮箱验证 var emailRule = /^[A-z0-9]+@[a-z0-9]+.com$/; reg("email", emailRule); break; case cellPhone: // 手机号验证 var cellPhoneRule = /^(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}$/; reg("cellPhone", cellPhoneRule); break; case identityCard: //身份证号验证 var identityCardRule = /^([1-9]){1}[0-9]{17}|[1-9]{1}[0-9]{16}(x|X)?$/; reg("identityCard", identityCardRule); break; case site: //地址验证 var siteRule = /^[\u4e00-\u9fa5]+[\u4E00-\u9FA5A-Za-z0-9_]+$/; reg("site", siteRule); break; //设置特殊情况 default: alert("操作错误！请关闭网页") break; } } //提交验证判断是否都符合正则表达式 function OnClick(){ //获取所有的span标签 var a = document.getElementsByTagName("span"); var str = ""; //循环获取span的内容 for (var i = 0; i < a.length; i++) { str+=a[i].innerText; } if(str == "√√√√√√√"){ alert("输入正确"); }else{ alert("输入错误"); } }

js代码

//输入框的校验
/**输入框的校验 消息显示区域的ID 必须按照eleId+"s"
 * @param {Object} eleId
 * @param {Object} rule
 */

function reg(eleId,rule){
	
	//动态的添加一个消息显示标签
	var inputValue = document.getElementById(eleId).value;
	var result = rule.test(inputValue.trim());
	if(result && inputValue != ""){
		document.getElementById(eleId+"s").innerHTML="√";
		document.getElementById(eleId+"s").style.color="green";
	}else{
		document.getElementById(eleId+"s").innerHTML="×";
		document.getElementById(eleId+"s").style.color="red";
	}
	
}

以上是“JS怎么使用正则表达式判断输入框失去焦点事件”这篇文章的所有内容，感谢各位的阅读！希望分享的内容对大家有帮助，更多相关知识，欢迎关注创新互联行业资讯频道！


网站名称：JS怎么使用正则表达式判断输入框失去焦点事件
转载注明：http://www.cdkjz.cn/article/gjhshg.html
返回首页 了解更多建站资讯

相关资讯

多年建站经验

多一份参考，总有益处

联系快上网，免费获得专属《策划方案》及报价

咨询相关问题或预约面谈，可以通过以下方式与我们联系

大客户专线   成都：13518219792   座机：028-86922220

在线咨询 提交需求
友情链接 交换友情链接
网站运营外贸营销网站建设成都网站设计绵阳梓潼做网站成都网络推广成都二枢机房成都网站建设成都做网站无边发光字东电技服

成都网站建设公司地址：成都市青羊区太升南路288号锦天国际A座10层 建设咨询028-86922220

成都快上网科技有限公司-四川网站建设设计公司 | 蜀ICP备19037934号 Copyright 2020,ALL Rights Reserved cdkjz.cn | 成都网站建设 | © Copyright 2020版权所有.

专家团队为您提供成都网站建设,成都网站设计,成都品牌网站设计,成都营销型网站制作等服务,成都建网站就找快上网！ | 成都网站建设哪家好？ | 网站建设地图