通用表单验证函数 - FormCheck JavaScript Function

以前在开发项目的时候，在没使用EXTJS之前，写了这个通用的表单验证函数。

 

在实际开发过程中，使用非常简单，确实大幅提高了开发效率

 

现在虽然用不到了，但扔了感觉可惜，留在这里当个纪念吧！

 

---

 

通用表单验证函数使用说明

Author : netwild

最后更新日期：2009-07-02

一、函数功能

在编写WEB应用时，经常需要对各种表单进行输入验证，为了节省开发时间，增加开发效率，编写统一验证函数。

二、函数说明

function chkForm(object form)

参数form为表单对象，支持两种方式：

1、表单对象：<form οnsubmit="return chkForm(this)">

2、表单名称：<form name="form1" οnsubmit="return chkForm('form1')">

返回值：boolean

三、与验证相关的属性

属性名称

属性类型

说明

默认值

适用控件

enNull

扩展属性

是否允许为空

true

input(text、radio、checkbox)、textarea、select

len

扩展属性

输入字符个数范围

0,2000

input(text)、textarea

temp

扩展属性

验证模版

无

input(text)、textarea

match

扩展属性

自定义规则

无

input(text)、textarea

skip

扩展属性

跳过验证

false

input(radio、checkbox)、select

title

标准属性

字段名称

无

任何控件

四、属性说明

1、enNull

例如：

<input type="text" name="inpUname" enNull="false" title="用户名" />

//表示该输入框不允许为空

<input type="radio" name="rdoSex" enNull="false" title="性别" />

//表示该组单选框为必选项

<input type="radio" name="rdoSex"  />

//在首个标签上注明即可

<input type="checkbox" name="chbDev" enNull="false" title="技术" />

//表示该组复选框为必选项

<input type="checkbox" name="chbDev"  />

//在首个标签上注明即可

<input type="checkbox" name="chbDev"  />

2、len

例如：

<input type="text" name="inpUname" len="6,18" title="用户名" />

//表示输入的字符个数在6到18个之间

//使用len属性，可以省略enNull属性

3、temp

取值范围：

number：匹配数值型，包括整数、负数、小数，并且小数位数不超过6位。

例如：423、-376、57.89、-0.34 都符合；sds、422.、.237 都不符合

number5：匹配数值型，包括整数、负数、小数，并且小数位数不超过5位。

number4：匹配数值型，包括整数、负数、小数，并且小数位数不超过4位。

number3：匹配数值型，包括整数、负数、小数，并且小数位数不超过3位。

number2：匹配数值型，包括整数、负数、小数，并且小数位数不超过2位。

number1：匹配数值型，包括整数、负数、小数，并且小数位数不超过1位。

number(len1,len2)：匹配数值型，包括整数、负数、小数，并且整数部分最长不超过len1，小数部分最长不超过len2

新！

money：匹配货币型，包括整数、负数、1位或2位小数

int：匹配数值型，包括整数、负数，不匹配小数

uint：匹配无符号数值型，包括正整数，不匹配小数

var：匹配变量命名规范，可包括：英文字母、数字和下划线，并且必须以英文字母开头

string：匹配字符型，包括任何字符及换行符

date：匹配标准的10位长度的日期型，例如：2009-06-24

time：匹配标准的8位长度的时间型，例如：16:51:08

datetime：匹配19位长度的日期＋时间型

timestep：匹配0－60之间的整数

weekstep：匹配0－7之间的整数

monthstep：匹配0－30之间的整数

exp01：表达式：str='value'

input：匹配除英文双引号、单引号之外的任意字符

parame：匹配除英文双引号、单引号、@ # % & * . ? 和空格之外的任意字符

4、match

该属性值为标准的JavaScript正则表达式。但不包括：^（起始符）、$（截止符）

为统一验证规则，除非极特殊情况之外，不建议直接使用match属性进行验证。

5、skip

该属性表示“跳过验证”，通常用于单选框、复选框及下拉框中，使用了enNull属性，但其中某些选项需要例外的情况

例如：

<select title="城市" enNull="false">

<option skip="true">--- 辽宁省 ---</option>

<option>沈阳</option>

<option>辽阳</option>

<option>大连</option>

<option skip="true">--- 广东省 ---</option>

<option>广州</option>

<option>深圳</option>

<option>东莞</option>

<option skip="true">--- 山东省 ---</option>

<option>济南</option>

<option>青岛</option>

</select>

//该下拉框为必选项，但只想选择其中的“市”，因此为“省”增加属性：skip=true，即使选择该项，也做无效处理。

6、title

控件名称描述

对于单选框和复选框来说，仅在第一个标签上设置该属性即可，其他同名的一组内的标签将默认继承第一个标签的设置。

 

---

 

formCheck.js

 

/** * @fileoverview 表单验证相关函数 * JavaScript. * * @author 网无忌 netwild@163.com * @version 1.0 */ /** * 验证表单输入规则（自定义） * @type boolean * @returns 验证结果 true/false */ var formChkDefaultMatch = {enNull:true,len:'0,2000',match:'',tempList:[]} //--- 预设置 验证模版！-------------- formChkDefaultMatch.tempList.push(["number","(//-)?(//d){1,3}((//,)?(//d){3})*(//.(//d){1,6})?","允许的类型：/t/n/t/n数值型，包括：正、负整数、小数，并且小数位数小于6位"]); formChkDefaultMatch.tempList.push(["number5","(//-)?(//d){1,3}((//,)?(//d){3})*(//.(//d){1,5})?","允许的类型：/t/n/t/n数值型，包括：正、负整数、小数，并且小数位数小于5位"]); formChkDefaultMatch.tempList.push(["number4","(//-)?(//d){1,3}((//,)?(//d){3})*(//.(//d){1,4})?","允许的类型：/t/n/t/n数值型，包括：正、负整数、小数，并且小数位数小于4位"]); formChkDefaultMatch.tempList.push(["number3","(//-)?(//d){1,3}((//,)?(//d){3})*(//.(//d){1,3})?","允许的类型：/t/n/t/n数值型，包括：正、负整数、小数，并且小数位数小于3位"]); formChkDefaultMatch.tempList.push(["number2","(//-)?(//d){1,3}((//,)?(//d){3})*(//.(//d){1,2})?","允许的类型：/t/n/t/n数值型，包括：正、负整数、小数，并且小数位数小于2位"]); formChkDefaultMatch.tempList.push(["number1","(//-)?(//d){1,3}((//,)?(//d){3})*(//.(//d){1,1})?","允许的类型：/t/n/t/n数值型，包括：正、负整数、小数，并且小数位数小于1位"]); formChkDefaultMatch.tempList.push(["int","(//-)?(//d){1,3}((//,)?(//d){3})*"],"允许的类型：/t/n/t/n数值型，包括：正、负整数"); formChkDefaultMatch.tempList.push(["uint","(//d){1,3}((//,)?(//d){3})*"],"允许的类型：/t/n/t/n无符号数值型，包括：正整数"); formChkDefaultMatch.tempList.push(["var","[a-zA-Z]{1}[0-9a-zA-Z_]*","允许的类型：/t/n/t/n变量命名规则，由英文字母a(A)到z(Z)、数字及下划线组成，并且以英文字母开头"]); formChkDefaultMatch.tempList.push(["money","(//-)?(//d){1,3}((//,)?(//d){3})*(//.(//d){1,2})?"],"允许的类型：/t/n/t/n货币型，包括：正、负整数，或小数位数在2位以内的小数"); formChkDefaultMatch.tempList.push(["string","(.|//n)*","允许的类型：/t/n/t/n任意字符型"]); formChkDefaultMatch.tempList.push(["input","[^///"//']*","允许的类型：/t/n/t/n字符型，除英文双引号、单引号"]); formChkDefaultMatch.tempList.push(["parame","[^///"//'///#//@//.//?//%//&//*//s]*","允许的类型：/t/n/t/n字符型，除英文双引号、单引号、# @ . ? % & * 等特殊字符"]); formChkDefaultMatch.tempList.push(["date","//d{4}//-//d{2}//-//d{2}","允许的类型：/t/n/t/n日期型，类似：YYYY-MM-DD"]); formChkDefaultMatch.tempList.push(["time","(0[0-9]|1[0-9]|2[0-3])//:(0[0-9]|[1-5][0-9])//:(0[0-9]|[1-5][0-9])","允许的类型：时间型，类似：HH:MM:SS"]); formChkDefaultMatch.tempList.push(["datetime","//d{4}//-//d{2}//-//d{2}// (0[0-9]|1[0-9]|2[0-3])//:(0[0-9]|[1-5][0-9])//:(0[0-9]|[1-5][0-9])"],"允许的类型：日期时间型，类似：YYYY-MM-DD HH:MM:SS"); formChkDefaultMatch.tempList.push(["timestep","([0-9]|([1-5][0-9])|60)","允许的类型：/t/n/t/n时间进制，包括0-60之间的正整数"]); formChkDefaultMatch.tempList.push(["weekstep","([0-7])","允许的类型：/t/n/t/n星期进制，包括0-7之间的正整数"]); formChkDefaultMatch.tempList.push(["monthstep","([0-9]|([1-2][0-9])|30)","允许的类型：/t/n/t/n月份进制，包括0-30之间的正整数"]); formChkDefaultMatch.tempList.push(["exp01","[a-zA-Z0-9]+(//.[a-zA-Z0-9]+)?//=//'[^']+//'","允许的类型：/t/n/t/n表达式，类似：str='value'"]); //--- 设置 验证模版结束 -------------- function arrLook(prmArr,prmSub){var index = -1;for(var i=0;i<prmArr.length;i++){if(prmArr[i]==prmSub){index = i;break;}}return index;} function chkForm(prmFormName){ var frmObj = (typeof(prmFormName) == "string")?document.getElementsByName(prmFormName)[0]:prmFormName; if(typeof(frmObj) == "undefined") return false; var frmEmts = frmObj.elements; var frmEmtsCnt = frmEmts.length; var checkObjList = [],arrObjList = []; var emtChkRet; for(var i=0;i<frmEmtsCnt;i++){ var emtObj = frmEmts[i]; var emtObjTagName = emtObj.tagName.toLowerCase(); if(emtObjTagName == "input" || emtObjTagName == "textarea"){ var emtObjType = (emtObj.type == undefined)?"text":emtObj.type; if(emtObjType == "text"){ emtChkRet = chkInputText(emtObj); if(!emtChkRet.value){alert(emtChkRet.desc);emtObj.focus();return false} }else if(emtObjType == "radio" || emtObjType == "checkbox"){ if(arrLook(checkObjList,emtObj.name) > -1) continue; checkObjList.push(emtObj.name); emtChkRet = chkInputCheck(frmObj,emtObj); if(!emtChkRet.value){alert(emtChkRet.desc);emtObj.focus();return false} } }else if(emtObjTagName == "select"){ emtChkRet = chkSelect(emtObj); if(!emtChkRet.value){alert(emtChkRet.desc);emtObj.focus();return false} } } return true; } /** * 验证文本框 */ function chkInputText(prmObj){ var tmpValue = prmObj.value; var tmpLen = prmObj.value.length; var tmpDesc = (prmObj.title == "")?prmObj.name:prmObj.title; var defEnNull = (prmObj.enNull == undefined)?formChkDefaultMatch.enNull:(prmObj.enNull!="false"); var defLen = (prmObj.len == undefined)?formChkDefaultMatch.len:prmObj.len; var defMatch = (prmObj.temp == undefined)?formChkDefaultMatch.match:prmObj.temp; var defMatchDesc = ""; if(defMatch != "" && /number/(/d+/,/d+/)/.test(defMatch)){var m=defMatch.match(/number/((/d+)/,(/d+)/)/);if(parseInt(m[2])>0){defMatch="(//-)?[//d//,]{1,"+m[1]+"}(//.(//d){1,"+m[2]+"})?";defMatchDesc="允许的类型：数值型，并且整数位数最大 "+m[1]+" 位，小数位数最大 "+m[2]+" 位"}else{defMatch="(//-)?[//d//,]{1,"+m[1]+"}";defMatchDesc="允许的类型：整数型，并且整数位数最大 "+m[1]+" 位"}} else if(defMatch != ""){for(var i=0;i<formChkDefaultMatch.tempList.length;i++) if(defMatch == formChkDefaultMatch.tempList[i][0]) {defMatch = formChkDefaultMatch.tempList[i][1];defMatchDesc = formChkDefaultMatch.tempList[i][2];break}} defMatch = (prmObj.match == undefined)?defMatch:prmObj.match; if((!defEnNull) && (tmpValue == "")) return {desc:'“'+tmpDesc+'”不允许为空！',value:false}; if(tmpLen<defLen.split(",")[0] || tmpLen>defLen.split(",")[1]) return {desc:'“'+tmpDesc+'”的输入长度不符合要求['+defLen+']！',value:false}; if(defMatch != "" && tmpValue != "") try{if(!eval("/^"+defMatch+"$/").test(tmpValue))return {desc:'“'+tmpDesc+'”的输入格式不符合要求！/t/n/t/n'+defMatchDesc,value:false}} catch(e){return {desc:'“'+tmpDesc+'”的验证规则错误！',value:false}} return {desc:tmpDesc,value:true}; } /** * 验证单选、复选 */ function chkInputCheck(frmObj,prmObj){ var tmpObjs = frmObj.all[prmObj.name]; var tmpDesc = (prmObj.title == "")?prmObj.name:prmObj.title; var enNull = (prmObj.enNull == undefined)?formChkDefaultMatch.enNull:(prmObj.enNull!="false"); var tmpObj,isChecked = false; for(var i=0;i<tmpObjs.length;i++){ tmpObj = tmpObjs[i]; if((tmpObj.skip != "true") && tmpObj.checked) isChecked = true; if((!enNull) && isChecked) return {desc:tmpDesc,value:true} } if(enNull) return {desc:tmpDesc,value:true} else return {desc:'请至少选择“'+tmpDesc+'”其中一个选项！',value:false} } /** * 验证下拉框 */ function chkSelect(prmObj){ var tmpDesc = (prmObj.title == "")?prmObj.name:prmObj.title; var enNull = (prmObj.enNull == undefined)?formChkDefaultMatch.enNull:(prmObj.enNull!="false"); if(enNull) return {desc:tmpDesc,value:true} if(prmObj.options.length < 1) return {desc:'“'+tmpDesc+'”的候选项为空！',value:false} if(prmObj.options[prmObj.options.selectedIndex].skip == "true") return {desc:'请至少选择“'+tmpDesc+'”其中一个选项！',value:false} else return {desc:tmpDesc,value:true} } /** * 验证日期范围是否合理 */ function chkDateRange(prmDate1,prmDate2){ var pat = //d{4}/-/d{2}/-/d{2}/; if(!pat.test(prmDate1)) return false; if(!pat.test(prmDate2)) return false; if(prmDate1 > prmDate2) return false; return true; } /** * 验证两个文本框输入值是否相同（常用于验证密码一致） */ function chkPassInput(prmPass1,prmPass2){ if(prmPass1 != prmPass2) return false return true; }