Validate表单验证插件的基本使用

Validate是基于jQuery的一款轻量级表单验证的插件,有丰富的表单验证规则,还有灵活的自定义验证规则,支持input,select,textarea的验证。

一、使用步骤

1.导入js文件

jquery-3.1.1.js   jQuery的js文件,一定要在所有js文件上边,文件下载地址:http://files.cnblogs.com/files/nidongde/jquery-3.1.1.zip

jquery.validate.js   validate的js文件。文件下载地址:http://static.runoob.com/download/jquery-validation-1.14.0.zip


	<script type="text/javascript" src="jquery-3.1.1.js"></script>
	<script type="text/javascript" src="jquery.validate.js"></script>					
						

2.表单定义元素时提供name属性,js代码验证表单时,validate要根据name属性来验证该元素。form提供id属性。

		
	<form action="" method="post" id="formId">
	  <div>用户名</div>
	  <div><input type="text" name="username"/></div>
	  <div><input type="submit" value="提交"/></div>
	</form>					
						

3.写js代码验证表单


	<script type="text/javascript">				
		$(document).ready(function(){
			  $("#formId").validate({ 
				  rules:{
					  username:{required:true}
				  },
				  messages:{
					  username:{required:"用户名不能为空!"}
				  }
			  });
		});
	</script>				
						

$("#formId").validate({});是告诉validate要验证的表单。

rules:{}是validate的验证规则,在里边根据每个元素的name属性,不同的需求,添加相应的验证规则。required就是validate默认的一个验证规则,作用是限制元素的值不能为空。

messages:{}是错误提示信息,根据rules中的name属性和验证规则,定义不同的提示信息。如果不定义messages,默认会根据每个元素使用的验证规则来调用validate的提示信息,是英文的。

以上操作就可以在用户对表单没有任何输入操作的时候限制这个表单提交,并且提示错误信息。



二、Validate默认校验规则

	(1)required:true               必输字段
	(2)remote:"remote-valid.jsp"   使用ajax方法调用remote-valid.jsp验证输入值
	(3)email:true                  必须输入正确格式的电子邮件
	(4)url:true                    必须输入正确格式的网址
	(5)date:true                   必须输入正确格式的日期,日期校验ie6出错,慎用
	(6)dateISO:true                必须输入正确格式的日期(ISO),例如:2009-06-23,1998/01/22 只验证格式,不验证有效性
	(7)number:true                 必须输入合法的数字(负数,小数)
	(8)digits:true                 必须输入整数
	(9)creditcard:true             必须输入合法的信用卡号
	(10)equalTo:"#password"        输入值必须和#password相同
	(11)accept:                    输入拥有合法后缀名的字符串(上传文件的后缀)
	(12)maxlength:5                输入长度最多是5的字符串(汉字算一个字符)
	(13)minlength:10               输入长度最小是10的字符串(汉字算一个字符)
	(14)rangelength:[5,10]         输入长度必须介于 5 和 10 之间的字符串")(汉字算一个字符)
	(15)range:[5,10]               输入值必须介于 5 和 10 之间
	(16)max:5                      输入值不能大于5
	(17)min:10                     输入值不能小于10

  • 1
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值