标签：
<!DOCTYPE HTML> <head> <meta charset="utf-8"> </head> <body> <form id="validForm" novalidate="novalidate"> <label for="username"> 用户名:<input type="text" name="username" id="username" /> </label> <label for="password"> 密码:<input type="text" name="password" id="password" /> </label> <label for="password"> 确认密码:<input type="text" name="confirm" id="confirm" /> </label> <input type="submit" id="submit" /> </form> <script> window.onload=function(){ new Valid(‘validForm‘,{ rules:{ username:{ require:true, isDigital:true, isMobile:true }, password:{ require:true, alphDig:true }, confirm:{ isEqualTo:‘password‘ } }, messages:{ username:{ require:‘我是不一样的东西‘ } } }) console.log(document.getElementById(‘username‘).messages_oby); } function Valid(formId,msg){ this.oForm=document.getElementById(formId); this.msg=msg; this.rules=this.msg.rules; this.messages=this.msg.messages; this.tips={//默认的提示消息 require:‘此项必须填写‘, alphDig:‘必须为字母数字组合‘, isDigital:‘必须为数字组合‘, isMobile:‘必须为手机号码组合‘, isEqualTo:‘必须与第一次输入一致‘ }; this.triggerevent=‘blur‘; this.validList=[]; //要验证的元素 for(var attr in this.rules){ var obj=document.getElementById(attr); obj.rules_oby=this.rules[attr];/*_oby防止属性名称冲突,在元素身上绑定事件规则*/ obj.messages_oby={};//放入消息提示的对象 obj.isDirty_oby=false;//判断是否为脏数据,即第一次不提示错误信息 this.validList.push(obj); } this.init(); } Valid.prototype.init=function(){ this.setTip(); } //默认提示语,每个要验证的元素上都有一个messages_oby对象 Valid.prototype.setTip=function(){ if(this.messages==undefined||tool_oby.isPlainObject(this.messages)){//没有传入默认提示值得情况 for(var i=0;i<this.validList.length;i++){//遍历需要验证的元素 var obj=this.validList[i]; for(var attr in obj.rules_oby){//设置第i个元素的tips if(obj.rules_oby[attr]){//规则为true时,传入默认信息 obj.messages_oby[attr]=this.tips[attr]; } } } }else{//有传入消息提示的情况 for(var i=0;i<this.validList.length;i++){//遍历需要验证的元素 var obj=this.validList[i]; var objId=this.validList[i].id; var objMsg=this.messages[objId];//获取第i个传入元素的tip对象 for(var attr in obj.rules_oby){//设置第i个元素的tips if(obj.rules_oby[attr]&&(objMsg!==undefined&&objMsg[attr])){//规则为true时,并且有传入tip obj.messages_oby[attr]=objMsg[attr]; }else{ obj.messages_oby[attr]=this.tips[attr]; } } } } } Valid.prototype.events=function(){//绑定验证事件 } /*--------工具方法----------------*/ //判断是否为空对象 var tool_oby={}; tool_oby.isPlainObject=function(obj){ var btn=false; for(var attr in obj){ btn=true; break; } if(btn){ return false; }else{ return true; } } /*--------验证方法----------------*/ var validFn_oby={}; validFn_oby.isDigital=function(str){//验证是否为数字 } validFn_oby.isMobile=function(str){//验证是否为手机号码 } validFn_oby.alphDig=function(str){//验证是否为数字字母组合 } validFn_oby.isEqualTo=function(obj,str){//验证是否与之前输入一样 } </script> </body> </html>
标签：
原文地址：http://www.cnblogs.com/obeing/p/5393595.html
