资讯频道 → Web前端
阅读更多

4顶
2踩

Web前端

原创新闻 Parsley：功能强大且易用的 JS 表单验证插件

2013-01-28 10:02 by 见习编辑 tyygming 评论(5) 有5674人浏览
javascript 表单验证 Parsley

声明：ITeye资讯文章的版权属于ITeye网站所有，严禁任何网站转载本文，否则必将追究法律责任！

Parsley（在线演示）是一款JavaScript表单验证插件，可以帮助你只使用简单的配置即可实现表单验证功能，这完全基于它的强大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>

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

官方网站：http://parsleyjs.org/

Github地址：https://github.com/guillaumepotier/Parsley.js

Via gbtags
来自: www.gbin1.com
4
顶
2
踩
评论 共 5 条 请登录后发表评论
5 楼 achun 2013-03-04 17:43
78425665 写道
achun 写道
data-required
看到这个代码就知道这个验证方案的写法老旧，已经脱离时代了。


那可以推荐一个与时俱进的验证框架吗？

https://github.com/dsheiko/HTML5-Form-Shim
临时搜索了一个，简单看了下介绍和代码，这个库是为老旧的不支持Html5 Form 的浏览器写的，当然也可以用于支持 HTML5 Form 验证的浏览器，
关键不同在于form表单代码是按照html5的标准写的，紧跟最新标准也是与时俱进的表现。
4 楼 78425665 2013-03-04 10:16
achun 写道
data-required
看到这个代码就知道这个验证方案的写法老旧，已经脱离时代了。


那可以推荐一个与时俱进的验证框架吗？
3 楼 gxz1989611 2013-01-30 17:15
有jquery-validator好用吗？前端校验插件我就知道这个。。。
2 楼 请输入用户名 2013-01-30 09:28
基于bootstrap嘛，感觉这个也不是很漂亮，跟bootstrap风格不像
1 楼 achun 2013-01-28 16:22
data-required
看到这个代码就知道这个验证方案的写法老旧，已经脱离时代了。

发表评论

您还没有登录,请您登录后再发表评论

相关推荐

  • jQuery验证插件大全：使用强大的jQuery验证插件提升表单验证功能

    通过使用这些强大的jQuery验证插件，我们可以轻松地实现各种表单验证需求。无论是简单的必填字段验证还是复杂的自定义验证规则，这些插件都提供了丰富的功能和选项，可以满足我们的需求。该插件会自动检测表单的提交...

  • 15个非常实用的JavaScript表单验证库

    客户端验证在任何项目都是不可缺少的，很多时候我们需要在用户提交到服务器之前给予提示。表单验证库允许开发人员自定义样式、错误消息和样式以及简化验证规则的创建。今天，我将与大家分享15个非常...

  • javascript功能插件大集合 前端常用插件 js常用插件

    管理着 JavaScript 库，并提供读取和打包它们的工具。 npm：npm 是 JavaScript 的包管理器。官网 Bower：一个 web 应用的包管理器。官网 component：能构建更好 web 应用的客户端包管理器。官网 spm：全新的静态包...

  • javascript功能插件大集合

    awesome-javascript 是 sorrycc 发起维护的 JS 资源列表，内容包括：包管理器、加载器、测试框架、运行器、QA、MVC框架和库、模板引擎、数据可视化、时间轴、编辑器等等。伯乐在线已在 GitHub 上发起「JavaScript ...

  • 【工具】15个非常实用的 JavaScript 表单验证库

    客户端验证在任何项目都是不可缺少的，很多时候我们需要在用户提交到服务器之前给予提示。表单验证库允许开发人员自定义样式、错误消息和样式以及简化验证规则的创建。今天，我将与大家分享15个非常...

  • 前端常用js插件

    CMS 框架模板引擎Flux数据可视化时间轴编辑器文件函数式编程响应式编程数据...验证键盘封装器浏览和引导通知幻灯片滑块控件表单组件输入日历选择文件上传其它提示模态框和弹出框滚动菜单表格/栅格框架手势触摸地图视频/...

  • javascript功能插件大集合，写前端的亲们记得收藏

    awesome-javascript 是 sorrycc 发起维护的 JS 资源列表，内容包括：包管理器、加载器、测试框架、运行器、QA、MVC框架和库、模板引擎、数据可视化、时间轴、编辑器等等。 伯乐在线已在 GitHub 上发起「JavaScript ...

  • JavaScript资源大全中文版（Awesome最新版）

    JavaScript资源大全中文版（Awesome最新版）

  • JavaScript 资源大全中文版

    管理着 javascript 库，并提供读取和打包它们的工具。 npm：npm 是 javascript 的包管理器。官网Bower：一个 web 应用的包管理器。官网component：能构建更好 web 应用的客户端包管理器。官网spm：全新的静态包...

  • JavaScript库资源

    jam - 使用以浏览器为中心且与RequireJS兼容的存储库的包管理器。 jspm - 无摩擦浏览器包管理。 恩德 - 无库图书馆。 volo - 从模板创建前端项目，添加依赖项并自动生成项目。 Duo - 下一代软件包管理器，

  • 【java】ssm+jsp+mysql+LD算法在线考试系统.zip

    【java】ssm+jsp+mysql+LD算法在线考试系统

  • 长短期记忆神经网络(LSTM)预测天气 环境:matlab 包含与ELM算法的对比 注:为.m程序编程，非工具箱

    长短期记忆神经网络(LSTM)预测天气 环境:matlab 包含与ELM算法的对比 注:为.m程序编程，非工具箱

  • SAP系统中利润中心转移价格的设定

    内容概要：本文探讨了利润中心转移价格这一概念及其在企业财务管理的应用方式与局限。文中介绍到利润中心转移价格是通过内部销售模拟外部市场的方法来进行企业内部各利润中心间的交易，目的是更好地衡量单个部门的工作成效。 文章详细说明了利用SAP系统配置利润中心转移价格的技术操作路径，并指出了实施该做法面临的几个挑战。其中包括，使用过程中增加的数据处理量会导致性能降低，不再记录利润中心层面上物料账的具体情况、需要准确确定转移定价以及严谨管理不同公司的存货调拨等流程。

  • ssm-vue-高校实验室管理系统-源码工程-32页从零开始全套图文详解-34页参考论文-27页参考答辩-全套开发环境工具、文档模板、电子教程、视频教学资源.zip

    资源说明： 1：csdn平台资源详情页的文档预览若发现'异常'，属平台多文档混合解析和叠加展示风格，请放心使用。 2：32页图文详解文档(从零开始项目全套环境工具安装搭建调试运行部署，保姆级图文详解)。 3：34页范例参考毕业论文，万字长文，word文档，支持二次编辑。 4：27页范例参考答辩ppt，pptx格式，支持二次编辑。 5：工具环境、ppt参考模板、相关教程资源分享。 6：资源项目源码均已通过严格测试验证，保证能够正常运行，本项目仅用作交流学习参考，请切勿用于商业用途。 7：项目问题、技术讨论，可以给博主私信或留言，博主看到后会第一时间与您进行沟通。 内容概要： 本系统基于 B/S 网络结构，在IDEA中开发。服务端用 Java 并借 ssm 框架(Spring+SpringMVC+MyBatis)搭建后台。前台采用支持 HTML5 的 VUE 框架。用 MySQL 存储数据，可靠性强。 能学到什么： 学会用ssm搭建后台，提升效率、专注业务。学习 VUE 框架构建交互界面、前后端数据交互、MySQL管理数据、从零开始环境搭建、调试、运行、打包、部署流程。

  • 基于Android课程表-仿超级课程表（高分课程作业）

    基于Android课程表-仿超级课程表（高分课程作业） 项目已获导师指导并通过的高分毕业设计项目，可作为课程设计和期末大作业，下载即用无需修改，项目完整确保可以运行。 包含：项目源码、数据库脚本、软件工具等，该项目可以作为毕设、课程设计使用，前后端代码都在里面。 该系统功能完善、界面美观、操作简单、功能齐全、管理便捷，具有很高的实际应用价值。 项目都经过严格调试，确保可以运行！可以放心下载

  • ssm-jsp-助学贷款-源码工程-32页从零开始全套图文详解-34页参考论文-27页参考答辩-全套开发环境工具、文档模板、电子教程、视频教学资源.zip

    资源说明： 1：csdn平台资源详情页的文档预览若发现'异常'，属平台多文档混合解析和叠加展示风格，请放心使用。 2：32页图文详解文档(从零开始项目全套环境工具安装搭建调试运行部署，保姆级图文详解)。 3：34页范例参考毕业论文，万字长文，word文档，支持二次编辑。 4：27页范例参考答辩ppt，pptx格式，支持二次编辑。 5：工具环境、ppt参考模板、相关教程资源分享。 6：资源项目源码均已通过严格测试验证，保证能够正常运行，本项目仅用作交流学习参考，请切勿用于商业用途。 7：项目问题、技术讨论，可以给博主私信或留言，博主看到后会第一时间与您进行沟通。 内容概要： 本系统基于 B/S 网络结构，在 IDEA 中开发。服务端用 Java 并借 ssm 框架(Spring+SpringMVC+MyBatis)搭建后台。用 MySQL 存储数据，可靠性强。 能学到什么： 学会用ssm搭建后台，提升效率、专注业务。学习使用jsp、html构建交互界面、前后端数据交互、MySQL管理数据、从零开始环境搭建、调试、运行、打包、部署流程。

  • Matlab simulink永磁同步电机在线惯量辨识模型，基于遗忘因子的递归最小二乘法 表贴式永磁同步电机 可以准确辨识转动惯量j，阻尼系数b，电感以及磁链等 有资料，基于sfunction写的

    Matlab simulink永磁同步电机在线惯量辨识模型，基于遗忘因子的递归最小二乘法。 表贴式永磁同步电机 可以准确辨识转动惯量j，阻尼系数b，电感以及磁链等。 有资料，基于sfunction写的，有注释，很容易看懂，

  • 三相逆变器 下垂控制 参数: 直流侧电压 800V 交流侧电压 220V 开关频率10kHz 模拟一次调频工况，0.5s增加有功，无功负载，通过下垂控制，系统降低频率增发无功，1s后恢复正常进入原始稳

    三相逆变器 下垂控制 参数: 直流侧电压 800V 交流侧电压 220V 开关频率10kHz 模拟一次调频工况，0.5s增加有功，无功负载，通过下垂控制，系统降低频率增发无功，1s后恢复正常进入原始稳定运行状态。 波形质量好，可以自行修改参数进一步开发使用。

  • xyplayer智能解析源码，影视解析接口，xyplayer影视解析源码 带xyplayer使用配置教程

    xyplayer智能解析源码，影视解析接口，xyplayer影视解析源码 带xyplayer使用配置教程 效果http://jx.seoheimao.cn/ XyPlayer智能解析源码v4.0.8正式版，无需安装，上传即可使用，非常便捷。 XyPlayer的功能如下： 云解析：自动调用第三方资源站进行资源播放。 API解析：支持调用苹果cms/海洋cms数据库资源。 在线搜索：用户可以直接在线搜索资源进行播放。 广告屏蔽：内置广告屏蔽代码，并提供详细使用说明，轻松屏蔽解析过程中的广告。 授权防盗用功能：可以设置域名和IP授权，保护商业解析的安全性。 在线直播：聚合全网优质在线直播源，快速播放，高清画质！可以无限添加！ 盗用跳转：当发现有人盗用你的解析时，自动跳转到你设置的网址。 缓存功能：对之前解析过的视频进行缓存，实现快速无延迟播放！（可选择关闭） 二次解析线路无限添加！ 智能解析：可以配置智能解析，针对不同来源站点自动调用解析方式！ xyplayer智能解析源码，影视解析接口，xyplayer影视解析源码 带xyplayer使用配置教程

  • 基于粒子群算法的配电网日前优化调度 采用IEEE33节点配电网搭建含风光，储能，柴油发电机和燃气轮机的经济调度模型 以运行成本和环境成本最小为目标，考虑储能以及潮流等约束，采用粒子群算法对模型进行求

    基于粒子群算法的配电网日前优化调度 采用IEEE33节点配电网搭建含风光，储能，柴油发电机和燃气轮机的经济调度模型。 以运行成本和环境成本最小为目标，考虑储能以及潮流等约束，采用粒子群算法对模型进行求解，得到电源的每小时出力情况。

Global site tag (gtag.js) - Google Analytics