做网站的时候,常常会涉及到各种表单验证。选择一款好用的表单验证插件,会降低表单验证开发的难度。在开发中,我目前使用的表单验证插件是:validator.js. validator.js 是一款轻量的表单验证插件,代码总共只有两百多行。

   validator.js 是一款基于 zepto/jQuery 的表单验证插件,当 zepto.js 和 jQuery 同时加载在页面里面的时候,validator.js 会优先作用于 jQuery. 下面的代码说明了为啥 validator.js 会优先作用于 jQuery:

 (function($){
/*
一些代码
*/
$.fn.validator=function(){ };
})(jQuery|zepto);

  既然  validator.js 的 validator 方法挂载了 $.fn 上,那么 validator.js 就可以被 jQuery/Zepto 的实例所使用.使用 的代码如下:  

 $('#form_id').validator(options);

validator 方法支持一个 options 对象作为参数。当不传参数时,options 具备默认值。参数储存在 $('').data('__options__')。完整的对象如下描述:

 options = {
// 需要校验的表单项,(默认是 `[required]`),支持任何 jQuery 选择器可以选择的标识
identifie: {String}, // 校验不通过时错误时添加的 class 名(默认是 `error`),当校验为空时,还同时拥有 `empty` 这个 classname
klass: {String}, // 错误出现时 `klass` 放在当前表单项还是父节点(默认是当前表单项)
isErrorOnParent: {Boolean}, // 触发表单项校验的方法,当是 false 在点 submit 按钮之前不校验(默认是 `blur`)
method: {String | false}, // 出错时的 callback,第一个参数是所有出错表单项集合
errorCallback(unvalidFields): {Function}, before: {Function}, // 表单检验之前
after: {Function}, // 表单校验之后,只有 __return true__ 才会提交表单
}
 

表单验证插件-validator.js 使用教程的更多相关文章

  1. jQuery 表单验证 jquery.validator.js

    前端开发中经常会碰到表单的制作,其中必备的功能就是提交前的一些简单的验证,非空啊.手机号码啊.E-mail等等等等,这里是一个 jQuery 的表单验证插件,蛮好用的,收录一下. 下面是验证的效果图: ...

  2. jquery插件-表单验证插件-validator对象

    三 Validator对象 1.介绍:Validate方法返回的对象称作Validator对象 2.使用 Validator对象常用方法 Validator.form() 返回:Boolean 验证: ...

  3. 表单验证插件之jquery.validate.js

    提到表单验证的插件,第一个想到的就是jquery.validate.js,所以小生想在这里稍微详细地说一下这款插件的具体使用方法,便于理解,我直接附上整段demo的代码(没怎么调样式,主要是看js): ...

  4. jQuery Validate 表单验证插件----通过name属性来关联字段来验证,改变默认的提示信息,将校验规则写到 js 代码中

    一.下载依赖包 网盘下载:https://yunpan.cn/cryvgGGAQ3DSW  访问密码 f224 二. 添加一个另外一个插件jquery.validate.messages_cn.js. ...

  5. jQuery Validate 表单验证插件----利用jquery.metadata.js将校验规则直接写在class属性里面并定义错误信息的提示

    一.下载依赖包 网盘下载:https://yunpan.cn/cryvgGGAQ3DSW  访问密码 f224 二. 添加一个另外一个插件jquery.metadata.js 并把校验规则写在控件里面 ...

  6. Jquery.validate.js表单验证插件的使用

    作为一个网站web开发人员,以前居然不知道还有表单验证这样好呀的插件,还在一行行写表单验证,真是后悔没能早点知道他们的存在. 最近公司不忙,自己学习一些东西的时候,发现了validation的一个实例 ...

  7. jQuery插件 -- 表单验证插件jquery.validate.js, jquery.metadata.js

    原文地址:http://blog.csdn.net/zzq58157383/article/details/7718352   最常使用JavaScript的场合就是表单的验证,而jQuery作为一个 ...

  8. 表单验证的validate.js插件---jQuery Validation Plugin

    早上在公交车上看了一个关于慕课网的教程<表单验证的validate.js插件---jQuery Validation Plugin>,正好可以用到自己近期开发简易微博的注册页面和登录页面, ...

  9. jQuery插件 -- 表单验证插件jquery.validate.js

    最常使用JavaScript的场合就是表单的验证,而jQuery作为一个优秀的JavaScript库,也提供了一个优秀的表单验证插件----Validation.Validation是历史最悠久的jQ ...

随机推荐

  1. 多校联赛7 1001 hdu 4666(最远哈曼顿距离+优先队列)

    吐个糟,尼玛今天被虐成狗了,一题都没搞出来,这题搞了N久居然还是搞不出来,一直TLE,最后还是参考别人代码才领悟的,思路就这么简单, 就是不会转弯,看着模板却不会改,艹,真怀疑自己是不是个笨蛋题意:求 ...

  2. Java并发编程之线程生命周期、守护线程、优先级、关闭和join、sleep、yield、interrupt

    Java并发编程中,其中一个难点是对线程生命周期的理解,和多种线程控制方法.线程沟通方法的灵活运用.这些方法和概念之间彼此联系紧密,共同构成了Java并发编程基石之一. Java线程的生命周期 Jav ...

  3. 【uoj#315/bzoj4943】[NOI2017]蚯蚓排队 Hash

    题目描述 给出 $n$ 个字符,初始每个字符单独成字符串.支持 $m$ 次操作,每次为一下三种之一: $1\ i\ j$ :将以 $i$ 结尾的串和以 $j$ 开头的串连到一起. $2\ i$ :将 ...

  4. hdu3712 Detector Placement

    题意:给一束激光,一个三棱柱,三棱柱会折射光,问这束激光最终是否会和y = 0相交: 分析:模拟题,为了方便处理折射角,事先求出每条边的向内和向外的法向量: findpoint : 找第一交点 ste ...

  5. 图像处理之色彩转换(CCM)

    1 色彩校正原理 人眼对色彩的识别,是基于人眼对光谱存在三种不同的感应单元,不同的感应单元对不同波段的光有不同的响应曲线的原理,通过大脑的合成得到色彩的感知.  一般来说,我们可以通俗的用 RGB三基 ...

  6. CDOJ--1141

    原题链接:http://acm.uestc.edu.cn/problem.php?pid=1141 分析:运用欧拉函数可解此题. #include <iostream> #include ...

  7. Netlink 介绍(译)

    原文地址:http://people.redhat.com/nhorman/papers/netlink.pdf 译文: 1 介绍 在Linux和Unix的众多发行版中的网络配置功能, 都是编程者事后 ...

  8. 报错laravel/horizon v1.4.3 requires ext-pcntl * -> the requested PHP extension pcntl is missing from your system.的解决办法

    执行composer install后报以下错误: Problem 1 - laravel/horizon v1.4.3 requires ext-pcntl * -> the requeste ...

  9. Docker入门与应用系列(一)介绍和部署

    Docker介绍 Docker 是一个开源的应用容器引擎,让开发者可以打包他们的应用以及依赖包到一个可移植的容器中,然后发布到任何流行的 Linux 机器上,也可以实现虚拟化.容器是完全使用沙箱机制, ...

  10. ElasticStack系列之六 & 版本冲突处理之乐观锁

    悲观并发控制(PCC) 这一点在关系数据库中被广泛使用.假设这种情况很容易发生,我们就可以阻止对这一资源的访问.典型的例子就是当我们在读取一个数据前先锁定这一行,然后确保只有读取到数据的这个线程可以修 ...