Jquey表单验证

 

第一步：在页底引入js
	http://st.beisen.com/common/validor.js（基于jquery的组件，因此保证已经引入了jquery库文件
第二步：提交验证
	$("#form_v").validate();  （form_v为form的id） 
第三步：验证规则对接方式
	以class形式与input等项对应关联，
	1:<input type="text" class="text required"/>为验证必填	
	2:class="text  {required:true,minlength:5,equalTo:'#email',accept:'com'}" 
	                必填，最小长度为5，值必须以id为email的对象value值一致，必须以com结尾
第三步：验证项说明
	required: "必填",
	remote: "修正验证，一般值为一个link，比如一个验证用户名唯一的ajax页面",
	email: "邮箱格式",
	url: "网址格式",
	number: "数字格式",
	digits: "整数格式",
	accept: "拥有合法后缀名的字符串",
	equalTo: "相同值验证，用于验证密码",
	maxlength: "字符串长度上限",
	minlength: "字符串长度下限",
	rangelength: "字符串长度区间",
	range: "字符串大小上限",
        specialchar: "不能输入特殊字符",(new)
	max: "字符串最大值",
	min: "字符串最小值",
第四步：扩展方式
	jQuery.validator.addMethod("isZipCode", function(value, element) {   
		var tel = /^[0-9]{6}$/;
		return this.optional(element) || (tel.test(value));
	}, "请正确填写您的邮政编码");	
	在对应的input上的class里添加isZipCode即可	
第五步：修改默认提示信息
	{messages:{remote:'用户名已存在'}}
	可以设置不同验证下同一输入框的反馈信息
特殊说明：remote
	remote值为一个程序验证页面，只需返回ture或false即可，下面例子中请输入admin1验证			

• 账户： <input type="text" class="text uname {required:true,messages: {remote:'用户名已存在'}}" remote="i/u.asp" name="uname" />
•  
• 邮箱： <input type="text" class="text required email" name="email" />
•  
• 验证邮箱： <input type="text" class="text {required:true,minlength:5,equalTo:'#email',accept:'com'}" name="email2" />
•  
• 整数： <input type="text" class="required digits" name="digits" />
•  
• 必填： <input type="text" class="text required" name="requ" />
•  
• 网址： <input type="text" class="text required url" name="url" />
•  
• 邮编： <input type="text" class="text require isZipCode" name="zipcode" />
•  
• 年龄： <input type="text" class="text {range:[13,23],min:15}" name="myage" />
•  
• 活动简介： <textarea name="desc" ></textarea>
•  
• 语言： <select class="required">……………………</select>
•   请选择 中文 英文 法文 德国 俄文
• 来源：
  <div class="InputGroup">
  <input type="checkbox" name="formwhere" class="checkbox required" /><label class="labelright">报纸</label>
  <input type="checkbox" name="formwhere" class="checkbox required" /><label class="labelright">电视</label>
  <input type="checkbox" name="formwhere" class="checkbox required" /><label class="labelright">网络</label>
  </div>
•  
  报纸 电视 网络
• 性别：
  <input type="radio" name="sex" class="checkbox required" /><label class="labelright">男</label>
  <input type="radio" name="sex" class="checkbox required" /><label class="labelright">女</label>
  <input type="radio" name="sex" class="checkbox required" /><label class="labelright">保密</label>
•   男 女 保密