Jquery 폼 인증 클래스 소개 및 인 스 턴 스

 
<form action="" method="post" id="formValidate"> 
  ：<input name="" type="text" validate="number" /><span></span><br/> 
   ：<input name="" type="text" validate="decimal" /><span></span><br/> 
  ：<input name="" type="text" validate="english" /><span></span><br/> 
    ：<input name="" type="text" validate="upper_english" /><span></span><br/> 
    ：<input name="" type="text" validate="lower_english" /><span></span><br/> 
    ：<input name="" type="text" validate="email" /><span></span><br/> 
      ：<input name="" type="text" validate="chinese" /><span></span><br/> 
URL：<input name="" type="text" validate="url" /><span></span><br/> 
    ：<input name="" type="text" validate="phone" /><span></span><br/> 
IP  ：<input name="" type="text" validate="ip" /><span></span><br/> 
  ：<input name="" type="text" validate="money" /><span></span><br/> 
        _：<input name="" type="text" validate="number_letter" /><span></span><br/> 
    ：<input name="" type="text" validate="zip_code" /><span></span><br/> 
    ：<input name="" type="text" validate="account" /><span></span><br/> 
QQ：<input name="" type="text" validate="qq" /><span></span><br/> 
   :<input name="" type="text" validate="card" /><span></span><br/> 
       ：<input name="" type="text" validate="number" empty='yes' /><span></span><br/> 
      1-3：<input name="" type="text" validate="number" min=1 max=3 /><span></span><br/> 
      1-3     ：<input name="" type="text" validate="number" min=1 max=3 empty='yes'/><span></span><br/> 
<input name="" type="submit" /> 
</form> 
<script src="jquery.js" type="text/javascript"></script> 
<script src="formValidate.js" type="text/javascript"></script> 
<script type="text/javascript"> 
var formValidate = new formValidate(); 
formValidate.init({}); 
</script> 

 
/* 
*   JS    
*     ： 
* var formValidate = new formValidate(); 
* formValidate.init({}); 
*   ： 
* <form action="" method="post" id="formValidate"> 
* id formValidate 
* 
* <input name="" type="text" validate="zip_code" empty="yes" min=10 max=10 /><span></span> 
* validate="zip_code"           
* empty="yes"          
* min=10      
* max=10      
* <span></span>        
*/ 
var formValidate = function () { 

var _this = this; 

this.options = { 
number : {reg : /^[0-9]+$/, str : '     '}, 
decimal : {reg : /^[-]{0,1}(\d+)[\.]+(\d+)$/ , str : '   DECIMAL  '}, 
english : {reg : /^[A-Za-z]+$/, str : '       '}, 
upper_english : {reg : /^[A-Z]+$/, str : '         '}, 
lower_english : {reg : /^[a-z]+$/, str : '         '}, 
email : {reg : /^([a-zA-Z0-9]+[_|\_|\.]?)*[a-zA-Z0-9]+@([a-zA-Z0-9]+[_|\_|\.]?)*[a-zA-Z0-9]+\.[a-zA-Z]{2,3}$/, str : 'Email     '}, 
chinese : {reg : /[\u4E00-\u9FA5\uf900-\ufa2d]/ig, str : '      '}, 
url : {reg : /^[a-zA-z]+:\/\/[^s]*/, str : 'URL     '}, 
phone : {reg : /^[1][3][0-9]{9}$/ , str : '         '}, 
ip : {reg : /^(\d+)\.(\d+)\.(\d+)\.(\d+)$/ , str : 'IP       '}, 
money : {reg : /^[0-9]+[\.][0-9]{0,3}$/ , str : '       '}, 
number_letter : {reg : /^[0-9a-zA-Z\_]+$/ , str : '         、  、_'}, 
zip_code : {reg : /^[a-zA-Z0-9 ]{3,12}$/ , str : '         '}, 
account : {reg : /^[a-zA-Z][a-zA-Z0-9_]{4,15}$/ , str : '      ，  5-16  ，        '}, 
qq : {reg : /[1-9][0-9]{4,}/ , str : 'QQ     '}, 
card : {reg : /^(\d{6})(18|19|20)?(\d{2})([01]\d)([0123]\d)(\d{3})(\d|X)?$/ , str : '        '}, 
}; 

//            
this.init = function (options) { 
this.setOptions(options); 
this.checkForm(); 
}; 

//     
this.setOptions = function (options) { 
for (var key in options) { 
if (key in this.options) { 
this.options[key] = options[key]; 
} 
} 
}; 

//           ，       ，     
this.checkForm = function () { 
$("#formValidate").submit(function () { 
var formChind = $("#formValidate").children(); 
var testResult = true; 
formChind.each(function (i) { 
var child = formChind.eq(i); 
var value = child.val(); 
var len = value.length; 
var childSpan = child.next(); 

//           
if (child.attr('empty')) { 
if (child.attr('empty') == 'yes' && value == '') { 
if (childSpan) { 
childSpan.html(''); 
} 
return; 
} 
} 

//   min   max         
var min = null; 
var max = null; 
if (child.attr('min')) min = child.attr('min'); 
if (child.attr('max')) max = child.attr('max'); 
if (min && max) { 
if (len < min || len > max) { 
if (childSpan) { 
childSpan.html(''); 
childSpan.html('       ' + min + ' ' + max + '  '); 
testResult = false; 
return; 
} 
} 
} else if (min) { 
if (len < min) { 
if (childSpan) { 
childSpan.html(''); 
childSpan.html('         ' + min); 
testResult = false; 
return; 
} 
} 
} else if (max) { 
if (len > max) { 
if (childSpan) { 
childSpan.html(''); 
childSpan.html('         ' + max); 
testResult = false; 
return; 
} 
} 
} 

//     
if (child.attr('validate')) { 
var type = child.attr('validate'); 
var result = _this.check(value, type); 
if (childSpan) { 
childSpan.html(''); 
if (result != true) { 
childSpan.html(' ' + result); 
testResult = false; 
} 
} 
} 

}); 
return testResult; 
}); 
}; 

//         
this.check = function (value, type) { 
if (this.options[type]) { 
var val = this.options[type]['reg']; 
if (!val.test(value)) { 
return this.options[type]['str']; 
} 
return true; 
} else { 
return '           '; 
} 
}; 


}