validate.js 表单验证类

来源:互联网 发布:铆工下料软件 编辑:程序博客网 时间:2024/05/16 05:39

<textarea cols="50" rows="15" name="code" class="c-sharp">/**------------------------validate.js------------------------ ※【功能】表单验证类 ------------------------函数说明------------------------ chk.reg:正则表达式; chk.config:待验证项目信息,对应项目说明: id:待验证项目的id.(类型:字符串,必填) tip:待验证项目的提示标题.(类型:字符串,必填) arr:待验证的项目,对应的内容分别是:(类型:数组,至少填一项) arr[0]待验证项目的正则表达式类型,即check.js中reg下面所对应的项目。如果不需要则为"".(类型:字符串) arr[1]待验证项目最少输入字符,如果不限制则为0.(类型:正整数) arr[2]待验证项目最大输入字符,如果不限制则为0.(类型:正整数) arr[3]待验证项目是否不能为空,是则为true,不限制则为"".(类型:字符串) arr[4]待验证项目内容与另一输入框内容是否相同,其中arr[4]为另一输入框的id,一般用于判断两次输入的密码是否相同.不判断则为""或者不填.(类型:字符串) chk.form:提交表单时验证,参数fm为表单的ID,调用方法为window.onload = chk.form(fm); chk.input:当前输入框内容验证,调用方法为window.onload = chk.form(); chk.limit:判断输入值是否在(n, m)区间,对应参数: str:待验证的字符串; n:最小值; m:最大值. chk.showErr:返回验证信息,对应参数: obj:待验证项目组件名称,主要用于当前输入框内容验证; errs:错误信息,如果为输入框内容验证则在其后面显示当前项目验证信息,如果为表单提交验证则在弹出消息框内显示错误信息列表.------------------------------------------------------*/function getObj(id){return typeof(id) === 'object' ? id:document.getElementById(id);}function $C(tag){return typeof(tag) === 'object' ? tag:document.createElement(tag);}function Trim(str){return str.replace(/(^/s*)|(/s*$)/g,"");}var chk = { reg:{ name:[/^[a-zA-Z]{1}[a-zA-Z0-9_/-]+$/, "只能由字母、数字以及(-_)组成,必须以字母开头."], pass:[/^[A-Za-z0-9]+$/, "只能由字母和数字组成."], str:[/^[0-9a-zA-Z_/u0391-/uFFE5]+$/, "只能由中文、字母、数字以及下划线组成."], eng:[/^[A-Za-z]+$/, "只能输入英文字母."], chs:[/^[/u4e00-/u9fa5]+$/, "只能输入中文."], num:[/^/d+$/, "只能输入数字."], mail:[/^[/w-]+(/.[/w-]+)*@[/w-]+(/.[/w-]+)+$/, "格式不正确."], qq:[/^[1-9]{1}[0-9]{4,10}$/, "必须由5-10个整数组成."], msn:[/^/w+([-+.]/w+)*@/w+([-.]/w+)*/./w+([-.]/w+)*$/, "格式不正确."], phone:[/^((/(/d{2,3}/))|(/d{3}/-))?(/(0/d{2,3}/)|(?:13/d|15[89])-?/d{5}(/d{3}|/*{3})|^[+]{0,1}(/d){1,3}[ ]?([-]?((/d)))|/d{11}|0/d{2,3}-)?[1-9]/d{6,7}(/-/d{1,4})?$/, "格式不正确."], mobile:[/^(?:13/d|15[89])-?/d{5}(/d{3}|/*{3})$/, "格式不正确."], //tell:[/^[+]{0,1}(/d){1,3}[ ]?([-]?((/d)|[ ]){1,12})+$)|(15|13|18^/d{9})|(^(/d{3,4}-)?/d{7,8})$/, "格式不正确."], post:[/^[1-9]{1}[0-9]{5}$/, "格式不正确."], price:[/^(/d{3,}(/./d{1,2})?|[5-9]/d(/./d{1,2})?)$/,"不正确,必须大于50.00"] }, config:[], //chk.config = [{id:"obj.id", title:"tipTitle", arr:[chk.reg.item, minsize, maxsize, isnull, comregeID]}] form:function(fm){ if (this.config &amp;&amp; getObj(fm)){ getObj(fm).onsubmit = function(){ var msg = "", n = 1, str, tip, rst, arr ,reg; for (i in chk.config){ str = Trim(getObj(chk.config[i].id).value); tip = chk.config[i].tip; arr = chk.config[i].arr; if (tip){ if (!str){ if (arr[3] === true) msg += "[" + (n++) + "]." + tip + "不能为空./n"; }else{ reg = chk.reg[arr[0]]; if (arr[1] || arr[2]){ rst = chk.limit(str, arr[1], arr[2]); if (rst !== "yes") msg += "[" + (n++) + "]." + tip + rst + "/n"; } if (arr[4] &amp;&amp; str !== getObj(arr[4]).value) {msg += "[" + (n++) + "]." + tip + "与上次输入内容不同." + "/n"} if (reg &amp;&amp; !reg[0].test(str)){msg += "[" + (n++) + "]." + tip + reg[1] + "/n";} } } } if (msg){msg = "以下原因导致提交失败:/n" + msg;} return chk.showErr("", msg); } } }, input:function(){ var msg, obj, arr, reg, k; for (i=0;i&lt;chk.config.length;i++){ //alert(getObj(chk.config[i].id).id); getObj(chk.config[i].id).setAttribute("key", i); getObj(chk.config[i].id).onblur = function(){ k = chk.config[this.getAttribute("key")]; if (k.tip){ msg = ""; obj = getObj(k.id); arr = k.arr; if (!obj.value){ msg = (arr[3] === true) ? "不能为空!":""; }else{ msg = "yes"; reg = chk.reg[arr[0]]; if (arr[1] || arr[2]) msg = chk.limit(obj.value, arr[1], arr[2]); if (msg === "yes" &amp;&amp; arr[4] &amp;&amp; obj.value !== getObj(arr[4]).value) msg = "与上次输入内容不同."; if (msg === "yes" &amp;&amp; reg &amp;&amp; !reg[0].test(obj.value)) msg = reg[1]; } if (msg &amp;&amp; msg !== "yes"){msg = k.tip + msg;} chk.showErr(obj, msg); if("username"==this.id&amp;&amp;""!=this.value&amp;&amp;msg=='yes') { return validateUserName(); } } obj.style.backgroundColor = "#EAFFCA"; } getObj(chk.config[i].id).onfocus = function(){getObj(chk.config[this.getAttribute("key")].id).style.backgroundColor = "#FFF";} } }, limit:function(str, n, m){ if (str){ var len = str.length; return (n &gt; 0 &amp;&amp; len &lt; n &amp;&amp; "不能少于" + n + "个字符.") || (m &gt; 0 &amp;&amp; len &gt; m &amp;&amp; "不能超过" + m + "个字符.") || "yes"; } }, showErr:function(obj, errs){ if (!obj){ if (errs){ alert(errs); return false; } }else{ var tips = getObj("ck_" + obj.id); if(!tips){ tips = $C("span"); tips.setAttribute('id',"ck_" + obj.id); tips.style.color="#F00"; tips.style.fontSize="12px"; obj.parentNode.appendChild(tips); } switch (errs) { case "": tips.innerHTML = ""; return true; case "yes": tips.innerHTML = "&nbsp;&lt;img src=""+ctx+"/js/yes.gif" mce_src=""+ctx+"/js/yes.gif" style="vertical-align:middle;" mce_style="vertical-align:middle;" /&gt;"; return true; default: tips.innerHTML = "&nbsp;&lt;img src=""+ctx+"/js/no.gif" mce_src=""+ctx+"/js/no.gif" style="vertical-align:middle;" mce_style="vertical-align:middle;" /&gt;&nbsp;" + errs; return false; } } }} jsp页面 调用脚本chk.config = [ {id:"username", tip:"邮箱地址", arr:["mail",0, 0,true]}, {id:"password", tip:"密码", arr:["pass",6, 16,true]}, {id:"password2", tip:"确认密码", arr:["",6, 16,true,"password"]}, {id:"name", tip:"姓名", arr:["str",2, 12,true]}, {id:"tell", tip:"电话 ", arr:["phone",7, 16,true]}, {id:"company", tip:"公司名", arr:["name"]} , {id:"postCode", tip:"邮政编码", arr:["post"]} ] window.onload=function(){ chk.form("fm1"); //fm1为表单id chk.input();} </textarea>

原创粉丝点击