首页 诗词 字典 板报 句子 名言 友答 励志 学校 网站地图
当前位置: 首页 > 教程频道 > 网站开发 > JavaScript >

用户体验超棒而且功能强大使用简单的javascript表单验证 - Parsley.js

2013-01-26 
用户体验超棒并且功能强大使用简单的javascript表单验证 - Parsley.js日期:2013-1-23来源:GBin1.com在线演

用户体验超棒并且功能强大使用简单的javascript表单验证 - Parsley.js

日期:2013-1-23  来源:GBin1.com

用户体验超棒而且功能强大使用简单的javascript表单验证 - Parsley.js

在线演示

大家还记得我们曾经介绍过的表单验证jquery插件jquery.validationEngine吧,使用这个插件你不需要写任何一行js代码就可以生成一个功能强大的表单验证功能。是不是超棒? 今天介绍的Parsley同样也可以帮助你只使用简单的配置即可实现表单验证功能,基于它的强大DOM-API。

主要特性基于超棒的用户体验超级方便配置超轻量级(压缩后12K),支持jQuery和Zepto超简单,只需要简单配置DOM-API,类似jQuery的data API绝对免费可靠性非常好内建的验证required:要求输入Not blank:不能为空Min length:最小长度Max length:最大长度Range length:长度区间Min:最小值Max:最大值Range:区域值RegExp:正则表达式Equal To:等于Min check:检查选择的checkbox的最少数量Max check:检查选择的checkbox的最多数量Range check:检查选择的checkbox的区间数量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>

是不是很方便,并且文档非常的完整,不过如果你需要使用中文,需要自己本地化一下,相信如果使用过的朋友一定会喜欢的!

来源:用户体验超棒并且功能强大使用简单的javascript表单验证 - Parsley.js

热点排行