Js表单验证
正则表达式(Regular Expression)是一种文本模式，包括普通字符（例如，a 到 z 之间的字母）和特殊字符（称为"元字符"）。
正则表达式使用单个字符串来描述、匹配一系列匹配某个句法规则的字符串。
Js正则语法：/ 正则表达式主体 / [ 修饰符 ]
符号
| 修饰符 | 描述 | 符号 | 描述 | 量词 | 描述 |
|---|---|---|---|---|---|
| i | 大小写不敏感匹配 | [] | 匹配一个字符 | * | 表示0到多次 |
| g | 全局匹配(匹配到后不停止) | ^ | 匹配字符串开头 | + | 表示1到多次 |
| m | 多行匹配 | $ | 匹配字符串结尾 | ? | 表示0或1次 |
| {} | 指定字符串长度 | ||||
| () | 表示一个整体 |
| 转移字符 | 描述 |
|---|---|
| s | 匹配一个空白字符 |
| S | 匹配一个除了空白之外的任意字符 |
| d | 匹配一个数字字符 |
| D | 匹配一个除了数字之外的任意字符 |
| w | 匹配一个数字、下划、字母或字符 |
| . | 除了换行符之外的任意字符 |
(?=.*[.......]):在该字符串中必须包含某个指定的符号
(?![........]+$):在该字符串中不是全是指定的符号
方法
test() 方法用于检测一个字符串是否匹配某个模式，如果字符串中含有匹配的文本，则返回 true，否则返回 false。
实例
var reg=/[a]/;//有一个a字符
var reg=/^[a]$/;//只有一个a字符
var reg=/^[a-z]$/;//有一个小写字母
var reg=/^[a-zA-Z]$/;//有一个字母
var reg=/^[a-zA-Z0-9]$/;//有一个字母或数字
var reg=/^[a-zA-Z0-9]/;//以字母或数字开头
var reg=/^[a-zA-Z]{14}$/;//有14个字母
var reg=/^[a-zA-Z]{1,14}$/;//有1-14个字母
var reg=/^[^a-z]+$/;//匹配一个或多个非小写字母
var reg=/^s+$/;//匹配一个或多个空白字符
var reg=/^.+$/;//匹配一个或多个任意字符
常用正则
/*是否带有小数*/
function isDecimal(strValue ){
var objRegExp= /^d+.d+$/;
return objRegExp.test(strValue);
}
/*校验是否中文名称组成 */
function ischina(str){
var reg=/^[u4E00-u9FA5]{2,4}$/; /*定义验证表达式*/
return reg.test(str); /*进行验证*/
}
/*校验是否全由8位数字组成 */
function isStudentNo(str) {
var reg=/^[0-9]{8}$/; /*定义验证表达式*/
return reg.test(str); /*进行验证*/
}
/*校验电话码格式 */
function isTelCode(str) {
var reg= /^((0d{2,3}-d{7,8})|(1[3584]d{9}))$/;
return reg.test(str);
}
/*校验邮件地址是否合法 */
function IsEmail(str) {
var reg=/^w+@[a-zA-Z0-9]{2,10}(?:.[a-z]{2,4}){1,3}$/;
return reg.test(str);
}
表单验证
<html>
<head></head>
<body>
<form action="####" method="post">
姓名:<input type="text" name="name" id="name" value="" onblur="myBlur(this)"/>
<span id="nameSpan"></span>
<p/>
密码:<input type="text" name="pwd" id="pwd" value="" onblur="myBlur(this)"/>
<span id="pwdSpan"></span>
<p>
电话:<input type="text" name="phone" id="phone" value="" onblur="myBlur(this)"/>
<span id="phoneSpan"></span>
<p>
邮箱:<input type="text" name="email" id="email" value="" onblur="myBlur(this)"/>
<span id="emailSpan"></span>
<p>
<input type="submit" id="sub" value="注册" disabled="disabled"/>
</form>
</body>
</html>
<script type="text/javascript">
var nameFlag=false;
var pwdFlag=false;
var phoneFlag=false;
var emailFlag=false;
function myBlur(obj){
var inputName=obj.name;
var inputValue=obj.value;
if(inputName=="name"){
nameFlag=false;
//说明当前失去焦点的是姓名框
var reg=/^[a-zA-Z]{4,8}$/;
if(reg.test(inputValue)){
document.getElementById("nameSpan").innerHTML="验证通过";
nameFlag=true;
}else{
document.getElementById("nameSpan").innerHTML="验证不通过";
}
ok();
}
if(inputName=="pwd"){
pwdFlag=false;
/*(?=.*[.......]):在该字符串中必须包含某个指定的符号*/
//var reg=/^(?=.*[0-9])(?=.*[a-z])(?=.*[A-Z])[a-zA-Z0-9]{8,12}$/;
/*(?![........]+$):在该字符串中不是全是指定的符号*/
var reg=/^(?![a-zA-Z]+$)(?![a-z0-9]+$)(?![A-Z0-9]+$)[a-zA-Z0-9]{8,12}$/
//必须同时包含大写小写以及数字
if(reg.test(inputValue)){
document.getElementById("pwdSpan").innerHTML="验证通过";
pwdFlag=true;
}else{
document.getElementById("pwdSpan").innerHTML="验证不通过";
}
ok();
}
if(inputName=="phone"){
phoneFlag=false;
var reg=/^(137|158|176|155)[0-9]{8}$/;
if(reg.test(inputValue)){
document.getElementById("phoneSpan").innerHTML="验证通过";
phoneFlag=true;
}else{
document.getElementById("phoneSpan").innerHTML="验证不通过";
}
ok();
}
if(inputName=="email"){
emailFlag=false;
var reg=/^w+@(qq|163|139|sina|gmall)(.[a-zA-Z]{1,5}){1,2}$/;
if(reg.test(inputValue)){
document.getElementById("emailSpan").innerHTML="验证通过";
emailFlag=true;
}else{
document.getElementById("emailSpan").innerHTML="验证不通过";
}
ok();
}
}
function ok(){
if(nameFlag&&pwdFlag&&phoneFlag&&emailFlag){
document.getElementById("sub").disabled=false;
}
}
</script>