JavaScript表单验证开发

/* 验证类型 testName: "验证用户", testPassword: "密码", testPhone: "手机号码", testQQ: "验证QQ", testLength: "验证是否在指定长度内", //3个参数，最小和最大 testEmail: "验证邮箱", testSame: "两个元素比较是否相同", //接受两个参数 testWX: "验证微信昵称", testPlane: "验证座机", testManCard: "验证身份证" */ /* 使用方法  * 创建实例对象 var a = new testInput();  * 传入dom-JQ对象和对应的检测的方法  * a.add( [$(".testName"),"testName"] ),以数组形式  * 可以接受2次数组多传 a.add([[$(".testName"),"testName"], [$(".testName"),"testName"]])  * 检测方法  * a.get( $(".testName") ) 获取单个结果，返回结果为JSON {result:'结果', text:'提示'}  * a.get( [$(".testName"), $(".testName")] ) 获取指定结果 返回结果为数组 [{obj:'',result:'',txt:''}, {obj:'',result:'',txt:''}]  * a.get() 如果不传入参数，则获取所有结果，不包含特殊验证 testLength, testSame  * 特殊检测  * 检测是字节长度是否在指定范围内 a.get( [$(".testLength"), min, max] ) 最小值最大值，数字类型  * 检测两个输入内容是否一致(2次密码确认) a.get([$(".testSama"), $(".testSama"), "same"]) 前两个为比较对象，第三个为固定必填参数  */  (function(window, $){  var proto = {  testName: function($obj){   var str = $obj.val();   if( !this.checkNormal(str) ){   return {    result: false,    txt: "由字母，数字、下划线组成"   }   };   if( !this.checkLength(str,6,20) ){   return {    result: false,    txt: "长度在6-20个字符以内"   }   };   if( !this.checkFirstA(str) ){   return {    result: false,    txt: "第一个字符不能为数字"   }   };   return {   result: true,   txt: ""   }  },  testPassword: function($obj){   return this.testName($obj);  },  testPhone: function($obj){   var str = $obj.val();   var re = /^1/d{10}$/;   if( re.test(str) ){   return {    result: true,    txt: ""   }   }else{   return {    result: false,    txt: "手机号码由11位数字组成"   }   }  },  testQQ: function($obj){   var str = $obj.val();   var re = /^/d{5,10}$/;   if( re.test(str) ){   return {    result: true,    txt: ''   }   }else{   return {    result: false,    txt: "5~10位数字"   }   }  },  testLength: function($obj, a, b){   if( this.checkLength($obj.val(),a,b) ){   return {    result: true   }   }else{   return {    result: false   }   }  },  testEmail: function($obj){   var re = /^(/w-*/.*)+@(/w-?)+(/./w{2,})+$/;   var str = $obj.val();   if( re.test(str) ){   return {    result: true,    txt: ""   };   }else{   return {    result: false,    txt: "邮箱格式不正确"   }   };  },  testSame: function($obj1, $obj2){   if( $obj1.val() == $obj2.val() ){   return {    result: true,    txt: ""   }   }else{   return {    result: false,    txt: "不一致"   }   }  },  testWX: function($obj){   var str = $obj.val();   var reg = /^[a-z_/d]+$/;   if( reg.test(str) ){   return {    result: true,    txt: ""   };   }else{   return {    result: false,    txt: ""   }   }  },  testPlane: function($obj){   var str = $obj.val();   var reg = /^/d{3,4}-/d{5,8}$/;   if( reg.test(str) ){   return {    result: true,    txt: ""   }   }else{   return {    result: false,    txt: "格式为:010-1234567"   }   }  },  testManCard: function($obj){   var str = $obj.val();   var reg = /(^/d{15}$)|(^/d{18}$)|(^/d{17}(/d|X|x)$)/;   if( reg.test(str) ){   return {    result: true,   }   }else{   return {    result: false,    text: "请输入正确的身份证号码"   }   }  },    /*   * 检测方法   */  checkEmpty: function(str){   if( str.trim() == '' ){   return false;   }else{   return true;   }  },  //检测第一个字母是否为数字  checkFirstA: function(str){   var first = str.charAt(0);   if( //d/.test(first) ){   return false;   }else{   return true;   }  },  //检测数字+字母  checkNormal: function(str){   var reg = /^(([a-z]+[0-9]+)|([0-9]+[a-z]+))[a-z0-9]*$/i;   if( reg.test(str) ){   return true;   }else{   return false;   }  },  //检测是否在规范长度内  checkLength: function(str,a,b){   var min = a || 6;   var max = b || 20;   var length = str.length;   if( length>=a && length <= b ){   return true;   }else{   return false;   }  },  //  add: function(arr){   !this.cache && (this.cache = []);   var isTwo = $.isArray(arr[0]);   if( isTwo ){   this.cache = this.cache.concat(arr);   }else{   this.cache.push(arr);   };   return this;  },  get: function(){   var This = this;   var args = arguments;   if( args.length === 0 ){   //检测所有， 返回数组结果   var tmp = [];   $.each(This.cache, function(i, val) {    var newArr = [].concat(val);    newArr.splice(1,1);    tmp.push( newArr );   });   return merges(tmp,10);   }else{   if( $.isArray(args[0]) ){ //[obj,obj,obj]    var tmp = [];    // 1.一个检测，带参数2，3 [obj,2,3]    // 2、一个检测，和另外一个是否相等 [obj,obj,'same']    // 3、多个检测，返回多个结果. [obj,obj]，又可能出现上面2种情况    if( !isNaN(args[0][1]) || !isNaN(args[0][2]) ){    tmp.push(args[0]);    return merges(tmp, 1);    };    if( args[0][2] == 'same' ){    args[0].splice(2,1);    tmp.push(args[0]);    return merges(tmp, 1);    };    $.each(args[0], function(i, val) {    if( $.isArray(val) ){     tmp.push(val);    }else{     tmp.push([val]);    };    });    return merges(tmp);   }else{    //常规    return merges([[args[0]]], 1);   }   };   function merges(arr, one){ //arr = [ [obj,a,b], [obj] ]   var result = [];   $.each(arr, function(i, val){    var oldName = val[0][0];    var tName;    $.each(This.cache, function(i2,val2) {    if( oldName == val2[0][0] ){     tName = val2[1];     return false;    };    });    var r;    if( one == 10){    if( tName == "testLength" || tName == "testSame" ){     r = {     tName: "请单独获取"     };    }else{     r = This[tName].apply(This, val);    };    }else{    r = This[tName].apply(This, val);    };    if( one==1 ){    result.push(r);    return false;    };    r.obj = val[0];    result.push( r );   });   return one==1 ? result[0] : result;   };  }  };  function Test(){  return this;  };  Test.prototype = proto;  Test.prototype.constructor = Test;  window.Test = Test; })(window, jQuery) 

add: function(arr){  !this.cache && (this.cache = []);  var isTwo = $.isArray(arr[0]);  if( isTwo ){  this.cache = this.cache.concat(arr);  }else{  this.cache.push(arr);  };  return this; } 

var This = this; var args = arguments; if( args.length === 0 ){  //检测所有， 返回数组结果  var tmp = [];  $.each(This.cache, function(i, val) {  var newArr = [].concat(val);  newArr.splice(1,1);  tmp.push( newArr );  });  return merges(tmp,10); } 

}else{  if( $.isArray(args[0]) ){ //[obj,obj,obj]  var tmp = [];  // 1.一个检测，带参数2，3 [obj,2,3]  // 2、一个检测，和另外一个是否相等 [obj,obj,'same']  // 3、多个检测，返回多个结果. [obj,obj]，又可能出现上面2种情况  if( !isNaN(args[0][1]) || !isNaN(args[0][2]) ){   tmp.push(args[0]);   return merges(tmp, 1);  };  if( args[0][2] == 'same' ){   args[0].splice(2,1);   tmp.push(args[0]);   return merges(tmp, 1);  };  $.each(args[0], function(i, val) {   if( $.isArray(val) ){   tmp.push(val);   }else{   tmp.push([val]);   };  });  return merges(tmp);  }else{  //常规  return merges([[args[0]]], 1);  } }; 

function merges(arr, one){ //arr = [ [obj,a,b], [obj] ]  var result = [];<span style="white-space:pre"> </span>//返回结果  $.each(arr, function(i, val){  var oldName = val[0][0];<span style="white-space:pre"> </span>//val为1次数组，得到源生dom对象  var tName;<span style="white-space:pre"> </span>//执行方法名字  $.each(This.cache, function(i2,val2) {   if( oldName == val2[0][0] ){<span style="white-space:pre"> </span>//如果传入dom和cache已保存的dom一样，则获取dom执行方法   tName = val2[1];   return false;   };  });  var r;  if( one == 10){<span style="white-space:pre"> </span>//全部获取，对特殊检测做特殊处理   if( tName == "testLength" || tName == "testSame" ){   r = {    tName: "请单独获取"   };   }else{   r = This[tName].apply(This, val);   };  }else{<span style="white-space:pre"> </span>//获取单个检测结果   r = This[tName].apply(This, val);  };  if( one==1 ){<span style="white-space:pre"> </span>//如果为1，则只单个检测，结果为[{}]，然后跳出   result.push(r);   return false;  };  r.obj = val[0];<span style="white-space:pre"> </span>//没有执行1的判断，说明是多个元素检测，手动增加一个obj属性，方便返回值查询，结果为[{},{}...]  result.push( r );  });  return one==1 ? result[0] : result;<span style="white-space:pre"> </span>//针对传入参数返回不同结果 };