========================================基本验证=============================================
| <script type="text/javascript"> | |
/*同意协议 提交按钮可用*/ |
|
| function ychecked(){ | |
| document.Myform.sub.disabled=!document.Myform.isok.checked; | |
| //disabled 属性规定应该禁用 input 元素。被禁用的 input 元素既不可用，也不可点击。 | |
|
} |
|
| /*页面加载出现验证码*/ | |
| function getyzm(){ | |
| var yzm=parseInt(Math.random()*9000+1000); | |
| var Syzm=document.getElementById("getyzm"); | |
| Syzm.innerHTML=yzm; | |
| Syzm.style.color="red"; | |
|
} |
|
| /*校验验证码*/ | |
| function xyyzm(){ | |
| /*获得验证码*/ | |
| var yzm=document.getElementById("getyzm").innerHTML;//innerHTML 属性设置或返回表格行的开始和结束标签之间的 HTML。 | |
| /*获得输入验证码*/ | |
| var inputyzm=document.Myform.yzm.value; | |
| if(inputyzm==null||inputyzm.length==0){ | |
| yzmSpan.innerHTML="表单项[验证码]不能为空！" | |
| yzmSpan.style.color="red"; | |
| return false; | |
| }else if(inputyzm!=yzm){ | |
| yzmSpan.innerHTML="表单项[验证码]输入有误"; | |
| yzmSpan.style.color="red"; | |
| return false; | |
| }else { | |
| yzmSpan.innerHTML="ok"; | |
| yzmSpan.style.color="green"; | |
| return true; | |
| } | |
|
} |
|
| function xychecked(){ | |
| var count=0; | |
| // 获得复选框对象组 | |
| var checkeds=document.getElementsByName("ah"); | |
| // 获得复选框验证信息span对象 | |
| var span=document.getElementById("ahSpan"); | |
| for(var i=0;i<checkeds.length;i++){ | |
| if(checkeds[i].checked){ | |
| count++; | |
| } | |
| } | |
| if(count>=2){ | |
| span.innerHTML="ok"; | |
| span.style.color="green"; | |
| return true; | |
| }else { | |
| span.innerHTML="表单项[爱好]至少选择两项" | |
| span.style.color="red"; | |
| return false; | |
| } | |
|
} |
|
| //纯文本表单验证 | |
| /*------------------------提取文本类的表单项---------------------------------*/ | |
| function show(reg,id){ | |
| //获得对象 | |
| var upwd=document.getElementById(id); | |
| //获得span对象 | |
| var span=document.getElementById(id+"Span"); | |
| //获得value值 | |
| var val=upwd.value; | |
| //获得alt值 | |
| var altval=upwd.alt; | |
| if(val==null||val.length==0){ | |
| span.innerHTML="表单项【"+altval+"】不能为空" | |
| span.style.color="red"; | |
| return false; | |
| }else{ | |
| if(!reg.test(val)){ | |
| span.innerHTML="表单项【"+altval+"】格式错误"; | |
| span.style.color="red"; | |
| return false; | |
| }else{ | |
| span.innerHTML="ok!"; | |
| span.style.color="green"; | |
| return true; | |
| } | |
| } | |
|
} |
|
| /*------------------------文本类的表单项---------------------------------*/ | |
| //验证用户名 | |
| function yzuname(){//首尾不能是数字其他科包含数字字母下划线范围6-12位 | |
| //创建正则对象 | |
| var reg=/^\D\w{5,11}$/ig;//正则表达式 | |
| var id="uname"; | |
| return show(reg,id); | |
|
} |
|
| //验证密码 | |
| function xypwd(){ | |
| //获得正则表达式 | |
| var reg=/^\d{6}$/g; //6位数字 | |
| var id="upwd"; | |
| return show(reg,id); | |
|
} |
|
| /*验证真实姓名*/ | |
| function yztname(){ | |
| var reg=/^[\u4e00-\u9fa5]{2,4}$/g; | |
| var id="tname"; | |
| return show(reg,id); | |
|
} |
|
| /*验证邮箱*/ | |
| function yzemail(){ | |
| var reg=/^(\w)+(\.\w)*@(\w)+(\.\w{2,3}){1,2}$/ig; | |
| var id="email"; | |
| return show(reg,id); | |
|
} /*验证手机号*/ |
|
| function yzphone(){ | |
| var reg=/^1[345678]\w{9}$/g; | |
| var id="phone"; | |
| return show(reg,id); | |
|
} |
|
| /*验证日期*/ function riqi(){ | |
| var reg=/^\d{4}\/([[0]\d{1}]|[1][12])\/(([0][1-9])|([12]\d{1})|([3][01]))$/g; | |
| var id="date"; | |
| return show(reg,id); | |
| } | |
| //汇总验证 | |
| function formsub(){ | |
| return xyyzm()&&xypwd()&&yzuname()&&yzphone()&&yzemail()&&yztname()&&getyzm() | |
| &&xychecked()&&riqi(); | |
| } | |
| </script> | |
|
</head> |
|
| <body onload="getyzm();"> | |
| <form action="http://www.baidu.com" method="get" target="_blank" name="Myform" onsubmit="return formsub();"> | |
| 用 户 名： <input type="text" name="uname" id="uname" alt="用户名" onblur="yzuname(); "/> | |
| <span id="unameSpan"></span><br /> | |
| 密----码： <input type="password" name="upwd" id="upwd" alt="密码" onblur="xypwd();"/> | |
| <span id="upwdSpan"></span><br /> | |
| 确认密码： <input type="password" name="qrpwd" id="qrpwd" alt="确认密码" /> | |
| <span id="qrpwd"></span><br /> | |
| 真实姓名： <input type="text" name="tname" id="tname" alt="真实姓名" onblur="yztname();"/> | |
| <span id="tnameSpan"></span><br /> | |
| 电子邮箱： <input type="text" name="email" id="email" alt="电子邮箱" onblur="yzemail();"/> | |
| <span id="emailSpan"></span><br /> | |
| 手机号码： <input type="text" name="phone" id="phone" alt="手机号码" onblur="yzphone();"/> | |
| <span id="phoneSpan"></span><br /> | |
| 日----期： <input type="text" name="date" id="date" alt="日期" onblur="riqi();"/> | |
| <span id="dateSpan"></span><br /> | |
| 爱好：<br /> | |
| <input type="checkbox" name="ah" value="1" onclick="xychecked();"/>电视<br /> | |
| <input type="checkbox" name="ah" value="2" onclick="xychecked();"/>电影<br /> | |
| <input type="checkbox" name="ah" value="3" onclick="xychecked();"/>看书<br /> | |
| <input type="checkbox" name="ah" value="4" onclick="xychecked();"/>吃饭<br /> | |
| <input type="checkbox" name="ah" value="5" onclick="xychecked();"/>睡觉<br /> | |
| <span id="ahSpan"></span><br /> | |
| 验 证 码： <input type="text" size="4" name="yzm" id="yzm" onblur="xyyzm();"/> | |
| <span id="getyzm" title="点击更换" onclick="getyzm();"></span> | |
| <span id="yzmSpan" ></span><br /> | |
| <input type="checkbox" id="isok" name="isok" onclick="ychecked();"/>同意公司的协议<br /> | |
| <input type="submit" value="提交" name="sub" disabled="disabled"/> | |
| </form> | |
|
</body> ========================================基本正则验证============================================= // 检查是否为有效的真实姓名，只能含有中文或大写的英文字母 function isValidTrueName(strName){ var str = Trim(strName); //判断是否为全英文大写或全中文，可以包含空格 var reg = /^[A-Z u4E00-u9FA5]+$/; if(reg.test(str)){ return false; } return true; } JavaScript表单验证年龄 JavaScript表单验证年龄，判断一个输入量是否符合年龄，通过正则表达式实现。 复制代码代码如下: //检查年龄 function isAge(str){ var mydate=new Date; var now=mydate.getFullYear(); if (str < now-60 || str > now-18){ return false; } return true; } JavaScript表单验证电话号码 JavaScript表单验证电话号码，判断一个输入量是否为电话号码，通过正则表达式实现。 复制代码代码如下: //检查电话号码 function isTel(str){ var reg=/^([0-9]|[\-])+$/g ; if(str.length18){ return false; } else{ return reg.exec(str); } } 正则表达式验证邮箱 JavaScript表单验证email，判断一个输入量是否为邮箱email，通过正则表达式实现。 复制代码代码如下: //检查email邮箱 function isEmail(str){ var reg = /^([a-zA-Z0-9_-])+@([a-zA-Z0-9_-])+((\.[a-zA-Z0-9_-]{2,3}){1,2})$/; return reg.test(str); } JavaScript表单验证中文大写字母 JavaScript表单验证中文大写字母，判断一个输入量是否为中文或大写的英文字母，通过正则表达式实现。 复制代码代码如下: // 检查是否为有效的真实姓名，只能含有中文或大写的英文字母 function isValidTrueName(strName){ var str = Trim(strName); //判断是否为全英文大写或全中文，可以包含空格 var reg = /^[A-Z u4E00-u9FA5]+$/; if(reg.test(str)){ return false; } return true; } JavaScript表单验证中文大写字母 JavaScript表单验证中文大写字母，判断一个输入量是否为中文或大写的英文字母，通过正则表达式实现。 复制代码代码如下: // 检查是否为有效的真实姓名，只能含有中文或大写的英文字母 function isValidTrueName(strName){ var str = Trim(strName); //判断是否为全英文大写或全中文，可以包含空格 var reg = /^[A-Z u4E00-u9FA5]+$/; if(reg.test(str)){ return false; } return true; } JavaScript表单验证是否为中文 JavaScript表单验证是否为中文，判断一个输入量是否为中文，通过正则表达式实现 复制代码代码如下: // 检查是否为中文 function isChn(str){ var reg = /^+$/; if(!reg.test(str)){ return false; } return true; } JavaScript表单验证密码 JavaScript表单验证密码是检查输入框是否为有效的密码， 密码只允许由ascii组成， 此函数只在修改或注册密码时使用。 也就是说一切不是ascii组成的字符串都不能通过验证。 具体函数checkValidPasswd请看下面的演示代码 复制代码代码如下: function checkValidPasswd(str){ var reg = /^[x00-x7f]+$/; if (! reg.test(str)){ return false; } if (str.length < 6 || str.length > 16){ return false; } return true; } JavaScript正则验证IP JavaScript正则验证IP，用途：校验ip地址的格式 输入：strIP：ip地址 返回：如果JavaScript通过验证IP返回true,否则返回false； JavaScript验证IP代码如下 function isIP(strIP) { if (isNull(strIP)) return false; var re=/^(\d+)\.(\d+)\.(\d+)\.(\d+)$/g //匹配IP地址的正则表达式 if(re.test(strIP)) { if( RegExp.$1 <256 && RegExp.$2<256 && RegExp.$3<256 && RegExp.$4<256) return true; } return false; } 通过正则去判断获得是是否是IP地址的格式，然后返回相应的结果 |