phpStudy
phpStudy
网站首页
软件下载
PHP教程
编程技术
PHP
MySQL
HTML
CSS
JavaScript
MSSQL
AJAX
.NET
JSP
window
Linux
Mac
ASP
服务器
CMS
SQL
jQuery
C#
C++
java
Android
IOS
oracle
MongoDB
PostgreSQL
SQLite
教程手册
php
html
html5
css
css3
JavaScript
ajax
jquery
sql
ado
asp
aspnet
browsers
careers
dhtml
dotnetmobile
dtd
e4x
glossary
hosting
htmldom
json
media
msnet
quality
rdf
rss
schema
semweb
site
sitemap
smil
soap
svg
tags
tcpip
vbscript
w3c
wap
web
webservices
wmlscript
wsdl
xforms
xhtml
xlink
xml
xmldom
xpath
xquery
xsl
xslfo
网站测速
小皮面板
智能dns
搜索
首页
PHP教程
强效、方便的表单通用检测JS 不错
强效、方便的表单通用检测JS 不错
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> <script language="javascript"> // 表单通用检测JS by www.it2048.com 整理/制作 H.Q.J 2007/1/10 //自定义属性解释(IE支持): //ii_chname：表示该数据的中文名称 //ii_minsize:表示允许输入的最小长度,单位字节 //ii_maxsize：表示允许输入的最大长度,单位字节 //ii_type:输入的数据类型 //ii_null：表示输入值是否允许为空。为yes时允许为空。 //ii_compare:比交是否与某项(ID)值相同 function chkRadio(o){ //判断单选 for (i=0;i<o.length;i++){ if (o[i].checked) return true; } return false; } function strlen(str){ /* 取得字符串的字节长度 */ var i; var len; len = 0; for (i=0;i<str.length;i++) { if (str.charCodeAt(i)>255) len+=2; else len++; } return len; } function isnull(str){ /* 检测字符串是否为空 */ var i; for (i=0;i<str.length;i++) { if (str.charAt(i)!=' ') return false; } return true; } function isNum(s) { /* 检测字符串是否为数字 */ var regu = "^[-+]?\d*$";//支持正负\小数 //var regu = "^([0-9]*)$"; //var regu = "^([0-9]*[.0-9])$"; // 小数测试 var re = new RegExp(regu); if (s.search(re) != -1) return true; else return false; } function isType(s,t){ /* 检测数据类型是否合法 */ var RegExpPtn; var t2=t; if (t2 != ""){ switch(s){ case "EN"://英文 RegExpPtn=/^[A-Za-z]+$/; if (!RegExpPtn.test(t2) ){return false;}else{return true;} break; case "CN"://中文 RegExpPtn=/^[\u4e00-\u9fa5]+$/; if (!RegExpPtn.test(t2) ){return false;}else{return true;} break; case "NUM"://实数 RegExpPtn=/^(\+|-)?\d+($|\.\d+$)/; if (!RegExpPtn.test(t2) ){return false;}else{return true;} break; case "INT"://正整数 RegExpPtn=/^[1-9]d*$/; if (!RegExpPtn.test(t2) ){return false;}else{return true;} break; case "DATE"://日期yyyy-mm-dd RegExpPtn=/^((((1[6-9]|[2-9]\d)\d{2})-(0?[13578]|1[02])-(0?[1-9]|[12]\d|3[01]))|(((1[6-9]|[2-9]\d)\d{2})-(0?[13456789]|1[012])-(0?[1-9]|[12]\d|30))|(((1[6-9]|[2-9]\d)\d{2})-0?2-(0?[1-9]|1\d|2[0-8]))|(((1[6-9]|[2-9]\d)(0[48]|[2468][048]|[13579][26])|((16|[2468][048]|[3579][26])00))-0?2-29-))$/; if (!RegExpPtn.test(t2) ){return false;}else{return true;} break; case "EMAIL"://邮件 RegExpPtn=/\w[\w.-]+@[\w-]+(\.\w{2,})+/gi; if (!RegExpPtn.test(t2) ){return false;}else{return true;} break; case "CARD"://身份证,也可直接调用isCard()函数 return isCard(t2) break; case "URL"://网址 RegExpPtn=/^[a-zA-z]+\:\/\/(\w+(-\w+)*)(\.(\w+(-\w+)*))*(\?\S*)?$/; if (!RegExpPtn.test(t2) ){return false;}else{return true;} break; case "IP"://IP地址,,也可直接调用isIP()函数 return isIP(t2) break; case "ID1"://ID类型1,充许英文+数字+下划线(0~30字节) RegExpPtn=/^[a-zA-Z][a-zA-Z0-9_]{0,29}$/; if (!RegExpPtn.test(t2) ){return false;}else{return true;} break; case "ID2"://ID类型1,充许中文+英文+数字+下划线(0~30字节) RegExpPtn=/^[a-zA-Z][a-zA-Z0-9_][_0-9a-zA-Z\u4e00-\u9fa5]{0,29}$/; if (!RegExpPtn.test(t2) ){return false;}else{return true;} break; default : break; } }else{ return false; } } function isCard(obj){ /*功能：验证身份证号码是否有效 */ var aCity={11:"北京",12:"天津",13:"河北",14:"山西",15:"内蒙古",21:"辽宁",22:"吉林",23:"黑龙江",31:"上海",32:"江苏",33:"浙江",34:"安徽",35:"福建",36:"江西",37:"山东",41:"河南",42:"湖北",43:"湖南",44:"广东",45:"广西",46:"海南",50:"重庆",51:"四川",52:"贵州",53:"云南",54:"西藏",61:"陕西",62:"甘肃",63:"青海",64:"宁夏",65:"新疆",71:"台湾",81:"香港",82:"澳门",91:"国外"}; var iSum = 0; var info = ""; var strIDno = obj; var idCardLength = strIDno.length; if(!/^\d{17}(\d|x)$/i.test(strIDno)&&!/^\d{15}$/i.test(strIDno)) { //alert("非法身份证号"); return false; } //在后面的运算中x相当于数字10,所以转换成a strIDno = strIDno.replace(/x$/i,"a"); if(aCity[parseInt(strIDno.substr(0,2))]==null) { //alert("非法地区"); return false; } if (idCardLength==18) { sBirthday=strIDno.substr(6,4)+"-"+Number(strIDno.substr(10,2))+"-"+Number(strIDno.substr(12,2)); var d = new Date(sBirthday.replace(/-/g,"/")) if(sBirthday!=(d.getFullYear()+"-"+ (d.getMonth()+1) + "-" + d.getDate())) { //alert("非法生日"); return false; } for(var i = 17;i>=0;i --) iSum += (Math.pow(2,i) % 11) * parseInt(strIDno.charAt(17 - i),11); if(iSum%11!=1) { //alert("非法身份证号"); return false; } } else if (idCardLength==15) { sBirthday = "19" + strIDno.substr(6,2) + "-" + Number(strIDno.substr(8,2)) + "-" + Number(strIDno.substr(10,2)); var d = new Date(sBirthday.replace(/-/g,"/")) var dd = d.getFullYear().toString() + "-" + (d.getMonth()+1) + "-" + d.getDate(); if(sBirthday != dd) { //alert("非法生日"); return false; } } return true; } function isIP(obj) { var re=/^(\d+)\.(\d+)\.(\d+)\.(\d+)$/; //IP正则 if(re.test( obj )) { if( RegExp.$1 <256 && RegExp.$2<256 && RegExp.$3<256 && RegExp.$4<256) return true; } //alert("请输入合法的计算机IP地址"); return false; } function verifyInput(input) {//检测指定自定义元素 var i; var msg=""; var error = false; var v=input.value; if((input.ii_null != undefined)&&(input.ii_null != "")&&(error==false)){ if (input.ii_null=="NO"&&isnull(v)) { //为空校验 msg +="*"+input.ii_chname+"值不能为空\n"; error = true; } } if((input.ii_type != undefined)&&(input.ii_type != "")&&(error==false)){ //检查类型 switch(input.ii_type){ case "EN": if (isType(input.ii_type,v)==false){ msg +="*"+input.ii_chname+"只能输入英文字符\n"; error = true; } break; case "CN": if (isType(input.ii_type,v)==false){ msg +="*"+input.ii_chname+"只能输入中文字符\n"; error = true; } break; case "NUM": if (isType(input.ii_type,v)==false){ msg +="*"+input.ii_chname+"值应该全为数字\n"; error = true; } break; case "INT": if (isType(input.ii_type,v)==false){ msg +="*"+input.ii_chname+"只能输入整数\n"; error = true; } break; case "DATE": if (isType(input.ii_type,v)==false){ msg +="*"+input.ii_chname+"填写错误(参考:2000-12-28)\n"; error = true; } break; case "EMAIL": if (isType(input.ii_type,v)==false){ msg +="*"+input.ii_chname+"填写错误(参考:abc@163.com)\n"; error = true; } break; case "CARD": if(isCard(v)==false){ msg +="*"+input.ii_chname+"填写错误,请检查\n"; error = true; } break; case "URL": if (isType(input.ii_type,v)==false){ msg +="*"+input.ii_chname+"填写错误(参考:http://www.xxxx.com)\n"; error = true; } break; case "IP": if(isIP(v)==false){ msg +="*"+input.ii_chname+"填写错误,请检查\n"; error = true; } break; case "ID1": if (isType(input.ii_type,v)==false){ msg +="*"+input.ii_chname+"填写错误(允许输入字母、数字和下划线)\n"; error = true; } break; case "ID2": if (isType(input.ii_type,v)==false){ msg +="*"+input.ii_chname+"填写错误(允许输入中文、字母、数字和下划线)\n"; error = true; } break; default : break; } } if((input.ii_minsize != undefined)&&(input.ii_minsize != "")&&(error==false)){ if (strlen(v)<parseInt(input.ii_minsize)) { //最小长度校验 msg +="*"+input.ii_chname+"内容太短(最少需"+input.ii_minsize+"个字节)\n"; error = true; } } if((input.ii_maxsize != undefined)&&(input.ii_maxsize != "")&&(error==false)){ if (strlen(v)>parseInt(input.ii_maxsize)) { //最大长度校验 msg +="*"+input.ii_chname+"超出最大长度("+input.ii_maxsize+"个字节)\n"; error = true; } } if((input.ii_compare != undefined)&&(error==false)){ var chv=document.getElementById(input.ii_compare).value; if ((chv != undefined)&&(chv != "")) { if(chv != v){ msg +="*"+input.ii_chname+"与"+document.getElementById(input.ii_compare).ii_chname+"内容不相符，请检查\n"; error = true; } } } if(error) alert(msg); return error; } function chkFromAll(myform) { //检测所有自定义元素 var i; for (i=0;i<myform.elements.length;i++) { if (myform.elements[i].ii_chname==undefined) continue;//跳过非自定义元素 if (verifyInput(myform.elements[i])==true)//检测当前元素 { myform.elements[i].focus(); return false; } } return true; } </script> <title>无标题文档</title> <style type="text/css"> <!-- body,td,th { font-size: 13px; color: #666666; } .STYLE1 {color: #FF0000} --> </style></head> <body> <table width="80%" border="0" align="center" cellpadding="5" cellspacing="1" bgcolor="#CCCCCC"> <tr> <td height="100" valign="top" bgcolor="#FFFFFF">JS通用表单Input检测块(IE支持) 通过自定义每一个Input的六个新属性(可省略任意个) //自定义属性解释(IE支持): //ii_chname：表示该数据的中文名称 //ii_minsize:表示允许输入的最小长度,单位字节 //ii_maxsize：表示允许输入的最大长度,单位字节 //ii_type:限制输入的数据类型，有 EN(英文),CN(中文),NUM(实数),INT(整数),DATE(短日期),EMAIL(邮件) CARD(身份证),URL(网址),IP(IP地址),ID1(英文帐号),ID2(中英文帐号) //ii_null：表示输入值是否允许为空。为yes时允许为空。 //ii_compare:比交是否与某项(ID)值相同 然后有二种检测方式， 一是在Input里直接加入onBlur="verifyInput(this);" 事件，可即时检测提示 二是在Form中onsubmit="return chkFromAll(this);"，提交才检测 使用可以直接本页内script部份另存为Form_Common.js包含就可以用，解决绝大部份表单检测 问题，与后台编程语言无关，加快后台程序编写效率，让你我更专注于后台编写 :) 由于众所周知的原因，FF等貌似不支持自定义属性，暂无解决方法(鄙视一下)。要想兼容可以自 写chkfrom函数利用document.getElementById('ID')和JS文件内函数来检测，也会加快效率 这只是我的web程序设计增效工具(Eff.Studio)的一部份，有朋友需要的话迟点我会公开由表直接自动生成表单工具、自动建立后台(含增加、列表、编辑、删除)的Class(因工作需要，暂只做ASP版) 将大大加快设计效率~~~支持啦~(支持转载，拷贝不究，恳留作者信息)</td> </tr> </table> <span class="STYLE1">演示表单：</span> <form id="form1" name="form1" method="post" action="Demo.html" onsubmit="return chkFromAll(this);"> <table width="80%" border="0" align="center" cellpadding="2" cellspacing="1" bgcolor="#CCCCCC"> <tr> <td width="20%" height="25" align="right" bgcolor="#FFFFFF"><span class="STYLE1">*</span>注册帐号：</td> <td bgcolor="#FFFFFF"><label> <input name="n1" type="text" id="n1" size="20" maxlength="16" onBlur="verifyInput(this);" ii_chname="注册帐号" ii_minsize="4" ii_maxsize="16" ii_type="ID1" ii_null="NO" /> (帐号只能由英文、数字和下划线组成,5-16个字符)</label></td> </tr> <tr> <td height="25" align="right" bgcolor="#FFFFFF"><span class="STYLE1">*</span>登陆密码：</td> <td bgcolor="#FFFFFF"><label> <input name="n2" type="text" id="n2" size="20" maxlength="50" onBlur="verifyInput(this);" ii_chname="登陆密码" ii_maxsize="50" ii_null="NO" /> </label></td> </tr> <tr> <td height="25" align="right" bgcolor="#FFFFFF"><span class="STYLE1">*</span>重复密码：</td> <td bgcolor="#FFFFFF"><label> <input name="n3" type="text" id="n3" size="20" maxlength="50" onBlur="verifyInput(this);" ii_chname="重复密码" ii_maxsize="50" ii_null="NO" ii_compare="n2" /> </label></td> </tr> <tr> <td height="25" align="right" bgcolor="#FFFFFF"><span class="STYLE1">*</span>真实姓名：</td> <td bgcolor="#FFFFFF"><label> <input name="n4" type="text" id="n4" size="20" maxlength="50" onBlur="verifyInput(this);" ii_chname="真实姓名" ii_maxsize="50" ii_type="CN" ii_null="NO" /> (只能为中文)</label></td> </tr> <tr> <td height="25" align="right" bgcolor="#FFFFFF"><span class="STYLE1">*</span>联系邮件：</td> <td bgcolor="#FFFFFF"><label> <input name="mail" type="text" id="mail" size="20" maxlength="50" /> </label></td> </tr> <tr> <td height="25" align="right" bgcolor="#FFFFFF"><span class="STYLE1">*</span>联系QQ：</td> <td bgcolor="#FFFFFF"><label> <input name="n5" type="text" id="n5" size="20" maxlength="50" onBlur="verifyInput(this);" ii_chname="联系QQ" ii_maxsize="50" ii_type="NUM" ii_null="NO" /> (只能为数字)</label></td> </tr> <tr> <td height="25" align="right" bgcolor="#FFFFFF">联系地址：</td> <td bgcolor="#FFFFFF"><label> <input name="n6" type="text" id="n6" size="30" maxlength="50"/> </label></td> </tr> <tr> <td height="25" align="right" bgcolor="#FFFFFF">自我简介：</td> <td bgcolor="#FFFFFF"><label> <textarea name="n7" cols="50" rows="8" id="n7" onBlur="verifyInput(this);" ii_chname="自我简介" ii_maxsize="200"></textarea> (最多100个字)</label></td> </tr> <tr> <td height="35" align="right" bgcolor="#FFFFFF"> </td> <td bgcolor="#FFFFFF"><label> <input type="submit" name="Submit" value=" 提交 " /> <input type="reset" name="Submit2" value=" 重置 " /> </label></td> </tr> </table> </form> </body> </html>
[Ctrl+A 全选 注:如需引入外部Js需刷新才能执行]
«
»
PHP教程
PHP简介
PHP基本语法
PHP类型
PHP变量
PHP运算符
PHP控制结构
PHP函数
PHP类与对象
PHP异常处理
函数库分类
快速导航
PHP
MySQL
HTML
CSS
JavaScript
MSSQL
AJAX
.NET
JSP
Linux
Mac
ASP
服务器
SQL
jQuery
C#
C++
java
Android
IOS
oracle
MongoDB
SQLite
wamp
交通频道
Copyright © 2016 phpStudy | 豫ICP备2021030365号-3