jquery 表单验证插件Parsley.js使用说明

发布时间:2019-09-22编辑:脚本学堂
本文介绍下,jquery表单验证插件Parsley的用法,介绍下它的设置与使用方法,它有着强大的DOM-API,有需要的朋友参考下吧。

jquery表单验证插件Parsley.js的主要特性:
 

1,基于超棒的用户体验
2,超级方便配置
3,超轻量级(压缩后12K),支持jQuery和Zepto
4,超简单,只需要简单配置DOM-API,类似jQuery的data API
5,绝对免费
6,可靠性非常好

内建的验证
 

1,required:要求输入
2,Not blank:不能为空
3,Min length:最小长度
4,Max length:最大长度
5,Range length:长度区间
6,Min:最小值
7,Max:最大值
8,Range:区域值
9,RegExp:正则表达式
10,Equal To:等于
11,Min check:检查选择的checkbox的最少数量
12,Max check:检查选择的checkbox的最多数量
13,Range check:检查选择的checkbox的区间数量
14,Remote:ajax验证

使用和配置Parsley.js是比较简的,只需要使用HTML的data属性来配置html即可。

例如:
 

复制代码 代码示例:
<form id="demo-form" data-validate="parsley">
<label for="fullname">Full Name * :</label>
<input type="text" id="fullname" name="fullname" data-required="true" />
<label for="email">Email * :</label>
<input type="text" id="email" name="email" data-trigger="change" data-required="true" data-type="email" />
<label for="website">Website :</label>
<input type="text" id="website" name="website" data-trigger="change" data-type="url" />
<label for="message">Message (20 chars min, 200 max) :</label>
<textarea id="message" name="message" data-trigger="keyup" data-rangelength="[20,200]"></textarea>
</form>