Javascript-正则表达式常用验证
1 <div> 2 <h1>一、判断中国邮政编码匹配</h1> 3 <p>分析：中国邮政编码都是6位，且为纯数字</p> 4 <div>邮政编码：<input id="Postcode" type="text" onblur="checkPost();" /></div> 5 <div id="Prompt"></div> 6 </div> 7 <script type="text/javascript"> 8 function checkPost() { 9 var Post = document.getElementById("Postcode").value; //获取输入框的值 10 var Prom = document.getElementById("Prompt"); //获取提示栏 11 var regPost = /^\d{6}$/; //解释：匹配数字6次，且开头到结尾都为数字 12 var isPost = regPost.test(Post); //测试 Post 是否符合 regPost 的规则，是则返回true，不是则返回false 13 if (isPost == false) { 14 Prom.innerHTML = "请输入正确的邮政编码"; 15 return false; 16 } 17 Prom.innerHTML = ""; 18 return true; 19 } 20 </script>
1 <div> 2 <h1>一、判断中国手机号</h1> 3 <p>分析：中国手机号都是11位，且为纯数字</p> 4 <div>手机号：<input id="Mobile" type="text" onblur="checkMobile();" /></div> 5 <div id="PromptM"></div> 6 </div> 7 <script type="text/javascript"> 8 function checkMobile() { 9 var Mobile = document.getElementById("Mobile").value; //获取输入框的值 10 var PromM = document.getElementById("PromptM"); //获取提示栏 11 if (Mobile.length != 11) { //首先判断其必须为11位 12 PromM.innerHTML = "请输入11位手机号"; 13 return false 14 } 15 /**分析： 16 * 手机号码: 17 * 13[0-9], 14[5,7], 15[0, 1, 2, 3, 5, 6, 7, 8, 9], 17[0, 1, 6, 7, 8], 18[0-9] 18 * 移动号段: 134,135,136,137,138,139,147,150,151,152,157,158,159,170,178,182,183,184,187,188 19 * 联通号段: 130,131,132,145,152,155,156,170,171,176,185,186 20 * 电信号段: 133,134,153,170,177,180,181,189 21 分析是在度娘里搜的，随便一搜就出来了很多了，这是2016年最新的 22 **/ 23 24 var regMobile = /^1(3[0-9]|4[57]|5[0-35-9]|7[01678]|8[0-9])\d{8}$/; 25 /**解释： 26 * ^1 开头为1 27 * 3[0-9] 第二位为3，第三位为0-9中的任意数字 28 * |4[57] 或第二位为4，第三位为5或7 29 * |5[0-35-9] 或第二位为5，第三位为0-3 5-9中的任意数字 30 * |7[01678] 或第二位为7，第三位为[...]中的任意数字 31 * |8[0-9] 或第二位为8，第三位为0-9中的任意数字 32 * \d{8}$ 后8为纯数字 33 **/ 34 var isMobile = regMobile.test(Mobile); 35 if (isMobile == false) { 36 PromM.innerHTML = "请输入正确的手机号"; 37 return false; 38 } 39 PromM.innerHTML = ""; 40 return true; 41 } 42 </script>
1 <div> 2 <h1>一、判断用户名</h1> 3 <p>分析：用户名每个平台的规定不一样，这里按“英文字母和数字组成的4-18为字符，以字母开头”为例</p> 4 <div>用户名：<input id="UseName" type="text" onblur="checkUseN();" /></div> 5 <div id="PromptU"></div> 6 </div> 7 <script type="text/javascript"> 8 function checkUseN() { 9 var UseN = document.getElementById("UseName").value; //获取输入框的值 10 var PromU = document.getElementById("PromptU"); //获取提示栏 11 if (UseN == "") { //判断用户名不为空 12 PromU.innerHTML = "用户名不能为空" 13 return false; 14 } 15 var regUseN = /^[A-z][A-z0-9]{3,17}$/; 16 /**解释： 17 * ^[A-z] 以字母开头 18 * [A-z0-9] 后面最少4位字母或数字，最多17个，且以此为结尾 19 **/ 20 var isUseN = regUseN.test(UseN); 21 if (isUseN == false) { 22 PromU.innerHTML = "请输入正确的用户名"; 23 return false; 24 } 25 PromU.innerHTML = ""; 26 return true; 27 } 28 </script>
1 <div> 2 <h1>一、判断密码</h1> 3 <p>分析：密码每个平台的规则也不尽相同，这里按“英文字母+数字+特殊符号的6-20位字符组成”为例</p> 4 <div>密码：<input id="password" type="password" onblur="checkPW();" /></div> 5 <div id="PromptPW"></div> 6 <div>确认密码：<input id="againpw" type="password" onblur="checkApw();" /></div> 7 <div id="PromptApw"></div> 8 9 </div> 10 <script type="text/javascript"> 11 var PW; 12 function checkPW() { 13 PW = document.getElementById("password").value; //获取密码输入框的值 14 var PromPW = document.getElementById("PromptPW"); //获取提示栏 15 if (PW == "") { //判断密码不为空 16 PromPW.innerHTML = "密码不能为空" 17 return false; 18 } 19 if (PW.length < 6) { //判断密码长度最少6位 20 PromPW.innerHTML = "密码最少为6位字符" 21 return false; 22 } 23 if (PW.length > 20) { //判断密码长度最多20位 24 PromPW.innerHTML = "密码最多只可以20位字符"; 25 return false; 26 } 27 var zm = /[A-z]/g //全局查找字母 28 if (zm.test(PW) == false) { 29 PromptPW.innerHTML = "密码必须包含至少一位字母" 30 return false; 31 } 32 var NaN = /\d/g //全局查找数字 33 if (NaN.test(PW) == false) { 34 PromptPW.innerHTML = "密码必须包含至少一位数字" 35 return false; 36 } 37 var fh = /[^A-z]\D/g //全局查找非数字与除了字母之外的字符 38 if (fh.test(PW) == false) { 39 PromptPW.innerHTML = "密码必须包含至少一位字符" 40 return false; 41 } 42 PromptPW.innerHTML = "" 43 return true; 44 } 45 46 47 function checkApw() { 48 var Apw = document.getElementById("againpw").value; //获取确认密码输入框值 49 var PromApw = document.getElementById("PromptApw"); //获取提示栏 50 if (Apw == "") { //判断确认密码不为空 51 PromApw.innerHTML = "确认密码不能为空" 52 return false; 53 } 54 if (Apw !== PW) { //判断确认密码值与密码值必须是否一致 55 PromApw.innerHTML = "两次输入的密码不一致"; 56 return false; 57 } 58 PromApw.innerHTML = ""; 59 return true; 60 } 61 </script>
<div>
<h1>一、判断电子邮件</h1>
<p>分析：888@qq.com 888@sina.com.cn</p>
<div>E-mail：<input id="email" type="text" onblur="checkEm();" /></div>
<div id="PromptEm"></div>
</div>
<script type="text/javascript">
function checkEm() {
var Em = document.getElementById("email").value; //获取E-mail输入框值
var PromEm = document.getElementById("PromptEm"); //获取提示栏
var regEm = /^[a-zA-Z0-9_-]{1,}@[a-zA-Z0-9_-]{1,}(\.[a-zA-Z]{2,}){1,2}$/;
/**解释
* ^[a-zA-Z0-9_-]{1,} 开头可以是字母、数字或“_-”，且1次以上
* @[a-zA-Z0-9_-]{1,} 接着是“@”，“@”后是可以是字母、数字或“_-”，且字母、数字或“_-”要1次以上
* (\.[a-zA-Z]{2,}) 接着后面应该是“.”，“.”后应为字母，且字母需2次以上
* {1,2} 像上面这种“.”后面是字母的，最少1次 ，最多只能2次
**/
var isEm = regEm.test(Em);
if (isEm == false) {
PromEm.innerHTML = "您输入的E-mail地址不合法"
return false;
}
PromEm.innerHTML = "";
return true;
}
</script>
1 <div> 2 <h1>一、判断出生年月日</h1> 3 <p>分析：1997-05-11 19970511 1997-5-2</p> 4 <div>出生年月：<input id="Birth" type="text" onblur="checkBth()" /></div> 5 <div id="PromptBth"></div> 6 </div> 7 <script type="text/javascript"> 8 function checkBth() { 9 var Bth = document.getElementById("Birth").value; //获取出生年月日输入框值 10 var PromBth = document.getElementById("PromptBth"); //获取提示栏 11 12 //首先大体判断下是否为正确的年月日格式 13 var regBth = /(19\d{2}|200\d{1}|201\d{1})-?(0?[1-9]|1[0-2])-?(0?[1-9]|[1-2]\d|3[0-1])/; 14 /**解释 15 * (19\d{2}|200\d{1}|201\d{1}) 匹配年份，
* 目前能有的年份开头仅有19xx也就是/19\d{2}/ || 200x也就是/200\d{1}/ || 201x也就是/201\d{1}/ 16 * -? 可以有-，也可以没有
* 这是为符合大部分人的书写习惯，我们加上这个判断，可以让匹配率更高，用户体验也更好 17 * (0?[1-9]|1[0-2]) 匹配月份，这里的0?与上面的-?是一样的作用 18 *(0?[1-9]|[1-2]\d|3[0-1]) 匹配日 19 **/ 20 var isBth = regBth.test(Bth); 21 if (isBth == false) { 22 PromBth.innerHTML = "请输入正确的出生年月"; 23 return false; 24 } 25 26 //判断瑞年平年，大小月的年月日格式 27 var YearR = /(19\d{2}|200\d{1}|201\d{1})/.exec(Bth)[0] / 4; //获取年份除以4，为判断是否为瑞平年 28 var YearZ = parseInt(YearR); //年份除以4取整，为判断是否为瑞平年 29 var month = /^(19\d{2}|200\d{1}|201\d{1})-?(0?[1-9]|1[0-2])/.exec(Bth)[0]; //获取年月 30 31 if (/2$/.test(month) == true) { //判断月份是否为2月 32 if (YearR == YearZ) { //判断是否为瑞年 33 if (/[30-31]$/.test(Bth) == true) { //判断是否有30或31 34 PromBth.innerHTML = "请输入正确的出生年月"; 35 return false; 36 } 37 } 38 else if (YearR !== YearZ) { //判断是否为平年 39 if (/(29|30|31)$/.test(Bth) == true) { //判断是否有29或30或31 40 PromBth.innerHTML = "请输入正确的出生年月"; 41 return false; 42 } 43 } 44 } 45 if (/(4|6|9|11)$/.test(month) == true) { //判断月份是否为4、6、9或11月 46 if (/31$/.test(Bth) == true) { //判断是否有31 47 PromBth.innerHTML = "请输入正确的出生年月"; 48 return false; 49 } 50 } 51 PromBth.innerHTML = ""; 52 return true; 53 } 54 </script>
作者：leona
版权声明：本文版权归作者和博客园共有，欢迎转载，但未经作者同意必须保留此段声明，且在文章页面明显位置给出原文链接
