为什么使用正则表达式
简洁的代码
严谨的验证文本框中的内容
正则表达式举例
匹配国内电话号码:\d{3}-\d{8}|\d{4}-\d{7}
匹配腾讯QQ号:[1-9][0-9]{4,}
匹配中国邮政编码:\d{6}
匹配身份证:\d{15}|\d{18}
匹配由数字和26个英文字母组成的字符串 ^[A-Za-z0-9]+$
匹配Email地址:\w+([-+.]\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*
匹配中文字符的正则表达式: [\u4e00-\u9fa5]
什么是正则表达式
Regular Expression,在代码中常简写为regex
正则表达式使用单个字符串来描述、匹配一系列符合某个句法规则的字符串。
在很多文本编辑器里,正则表达式通常被用来检索、替换那些符合某个模式的文本。
如何创建正则表达式
var reg=/china/;
var reg=new RegExp("china");
正则表达式的重复字符
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<script src="js/jquery-1.9.1.js" type="text/javascript" charset="utf-8"></script>
<script type="text/javascript">
function checkCode(){
//获取邮政编码
var code = $("#code1").val();
//定义验证邮政编码的正则表达式
//var regex = /[0123456789][0123456789][0123456789][0123456789][0123456789][0123456789]/;
//var regex = /[0-9][0-9][0-9][0-9][0-9][0-9]/;
//var regex = /\d\d\d\d\d\d/; //decimal binary o h
//var regex = /\d{6}/;
var regex = /^\d{6}$/;
//使用正则表达式验证邮政编码
if(regex.test(code)){
$("#code_prompt").html("格式正确");
}else{
$("#code_prompt").html('<span style="font-weight: bold;color:red">格式错误</span>');
}
}
function checkMobile(){
//获取手机号码
var mobile = $("#mobile").val();
//定义验证手机号码的正则表达式
var regex = /^1[35789]\d{9}$/;
//使用正则表达式验证手机号码
if(regex.test(mobile)){
$("#mobile_prompt").html("格式正确");
}else{
$("#mobile_prompt").html('<span style="font-weight: bold;color:red">格式错误</span>');
}
}
function checkEmail(){
//获取email
var email = $("#email").val();
//定义验证email的正则表达式
/**
* maillkl@sohu.com
* 178170733@qq.com
* dfadf234@163.com
* adf_adf@sina.com.cn
* adfadfad@sxt.cn
*
* 邮箱名 字母、数字、下划线 长度5-15
* @
* 机构名称 字母 数字 不可以下划线 2-6
* .
* 域名 com cn edu hk org 2-3位 字母 1-2次
*/
//var regex = /^[a-zA-Z0-9_]{5,15}@[a-zA-Z0-9]{2,6}(\.[a-zA-Z]{2.3}){1,2}$/;
var regex = /^\w{5,15}@[a-zA-Z0-9]{2,6}(\.[a-zA-Z]{2.3}){1,2}$/;
//使用正则表达式验证email
if(regex.test(email)){
$("#email_prompt").html("格式正确");
}else{
$("#email_prompt").html('<span style="font-weight: bold;color:red">格式错误</span>');
}
}
</script>
</head>
<body>
<form name="form1" id="form11">
邮政编码:
<input id="code1" name="code2" type="text" οnblur="checkCode()" />
<div id="code_prompt"></div>
手机号码:
<input id="mobile" type="text" οnblur="checkMobile()" />
<div id="mobile_prompt"></div>
邮箱:
<input id="email" name="email" type="text" οnblur="checkEmail()" />
<div id="email_prompt"></div>
</form>
</body>
</html>