规则定义方式

(1). 正则

适用于使用单个正则能搞定的验证。

// 使用数组包裹正则和错误消息,规则不通过时提示该消息
mobile: [/^1[3458]\d{9}$/, '请检查手机号格式']
// 或者,直接定义正则,需要另外定义错误消息,否则提示默认消息
mobile: /^1[3458]\d{9}$/

(2). 函数

函数方式具有最大的灵活性,搞定任何验证。不同返回值,导致不同验证结果:

返回值 结果 描述
return undefined(无返回)   不影响验证结果不提示消息(继续验证下一个规则)
return null   忽略本次验证(跳过该字段的验证,如果已经显示了消息将会自动隐藏)
return true √通过  
return false ×不通过  
return "" √通过  
return "错误消息" ×不通过 提示“错误消息”
return {"ok": "正确"} √通过 提示“正确”
return {"error": "错误消息"} ×不通过 提示“错误消息”
return $.ajax()   ajax验证,等待服务器返回验证结果

例1:自定义规则,如果通过返回true,否则返回错误消息

 mobile: function(element, params) {

    return /^1[3458]\d{9}$/.test(element.value) || '请检查手机号格式';
} 例2:使用内置的 .test() 方法检测是否符合某个规则
loginName: function(element) {
return /^[a-zA-Z]\w{3,}/.test(element.value) ||
this.test(element, "mobile")===true ||
this.test(element, "email")===true ||
'请填写用户名、手机号或者邮箱';
} 例3:自定义 ajax 验证
// 你只需要将 $.ajax 返回,并且保证 response 符合上面的返回值说明,其他的插件都会自动处理。
// 当然,你也可以加上 success 回调做点别的,或者自己加上自定义 header
myRemote: function(element){
return $.ajax({
url: 'check/username.php',
type: 'post',
data: element.name +'='+ element.value,
dataType: 'json'
});
}
例4:无返回值,对验证结果没有影响
passwordStrength: function() {
// 密码强度验证 和 UI处理
}
例5:动态跳过当前字段的验证
myRule: function() {
if (foo) {
return "Error Message"
}
// 跳过验证(当前规则之后的所有规则都不被验证)
else (bar) {
return null
}
}

规则作用范围

(1). 全局

使用 $.validator.config(),建议配置在 local 配置文件(如:zh-CN.js)中
任何实例,任何字段都能访问到该规则

$.validator.config(
rules: {
mobile: [/^1[3-9]\d{9}$/, "请填写有效的手机号"],
chinese: [/^[\u0391-\uFFE5]+$/, "请填写中文字符"]
}
);

(2). 当前实例

在调用初始化验证的时候传参,只对调用时的实例有效

$("#myForm").validator(
rules: {
mobile: [/^1[3-9]\d{9}$/, "请填写有效的手机号"],
chinese: [/^[\u0391-\uFFE5]+$/, "请填写中文字符"]
}
);

(3). 当前字段

只能通过 DOM 方式在表单元素上定义

<input name="demo" data-rule="required;xxx" data-rule-xxx="[/^\d{6}$/, '请输入6位数字']">

 
 

Nice Jquery Validator 自定义规则的更多相关文章

  1. jQuery.validator 验证规则详解

    前言:jQuery.validator是一款非常不错的表单验证插件,验证方式非常简单方便,它还对HTML5做了兼容处理,了解了验证规则,就基本掌握了它的使用,下面就让我一一道来 jQuery.vali ...

  2. jQuery validator自定义

    项目中接触到validator,记录下 jQuery.validator.addMethod("isStrongPwd", function(value, element){ va ...

  3. jquery validate自定义规则

    //检查身份证号码是否存在 $.validator.addMethod("checkIDCardExist", function (value, element) { if ($( ...

  4. Nice Jquery Validator 常用规则整理

    一些简单规则 numeric: [/^[0-9]*$/, '请填写数值'], money: [/^(?:0|[1-9]\d*)(?:\.\d{1,2})?$/, "请填写有效的金额" ...

  5. jQuery.validator 详解二

    前言:上一篇详细的介绍了jQuery.validator( 版本v1.13.0 )的验证规则,这一篇重点讲述它的源码结构,及如何来对元素进行验证,错误消息提示的内部实现 一.插件结构(组织方式) 在讲 ...

  6. jQquery.validate自定义规则的使用案例

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  7. jQuery.validator 详解

    jQuery.validator 详解二 前言:上一篇详细的介绍了jQuery.validator( 版本v1.13.0 )的验证规则,这一篇重点讲述它的源码结构,及如何来对元素进行验证,错误消息提示 ...

  8. jQuery.Validate自定义规程的使用案例

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  9. jquery validate自定义checkbox验证规则和样式

    参考:http://blog.csdn.net/xh16319/article/details/9987847 自定义checkbox验证,“检查checkbox是否选中” jQuery.valida ...

随机推荐

  1. SAP Basis 客户端拷贝

    一.版本.系统配置信息 软件 版本信息 操作系统 AIX 6.1 SAP ECC6.0 SAP_BASIS 7.00SP15kernel 720 600 oracle 11.2.0.2.0 DB大小 ...

  2. 根据ip查询ip归属地

    http://www.oschina.net/code/snippet_944819_33978 http://www.jb51.net/article/54287.htm public String ...

  3. SpringAOP注解报错:java.lang.IllegalArgumentException: error at ::0 can't find referenced pointcut selectAll

    原因 我使用的aspectjweaver.jar版本是1.5.1,版本过低,导致报错. 需要下载高本版的aspectjweaver.jar. 解决办法 在这里下载:https://mvnreposit ...

  4. POJ3169

    题目链接:http://poj.org/problem?id=3169 AC思路: spfa算法. 设各牛的位置为x[ ]. 对于感情好的牛,即第2到ML+1行:A B D, 有x[B] - x[A] ...

  5. protected和private的区别

    1. protected和private在没有继承关系的类A和类B之间其作用都可以视为式一样的--表示私有--每个类中的protected字段/属性都不能被访问到: 2. 当类与类之间存在继承关系时候 ...

  6. [安卓基础] 008.Android中的显示单位

    *:first-child { margin-top: 0 !important; } body > *:last-child { margin-bottom: 0 !important; } ...

  7. 这个Maven依赖的问题,你敢说你没遇到过

    Maven 依赖没处理好的话经常会导致发生一些问题,非常烦.今天给大家分享一个依赖相关的问题,说不定你之前就遇到过. 问题背景 有个 ES 搜索的项目,刚开始还是好好的状态,过了一段时间,然后就发现启 ...

  8. SpringBoot获取配置文件,就这么简单。

    在讲SpringBoot 获取配置文件之前我们需要对SpringBoot 的项目有一个整体的了解,如何创建SpringBoot 项目,项目结构等等知识点,我在这里就不一一讲述了,没有学过的小伙伴可以自 ...

  9. Postman学习笔记(一)

    一.简介 Postman是一种网页调试与发送网页 http 请求的 chrome 插件.我们可以用来很方便的 模拟 get 或者 post 或者其他方式的请求来调试接口. 二.安装 1.chrome浏 ...

  10. 【Linux】将javaweb项目部署到CentOS的tomcat上

    1.将项目打包成war包 build之后war文件就生成了. 2.拷贝war文件到CentOS的tomcat的项目文件夹中 用WinSCP将文件粘帖进这个文件夹中 /wocloud/tomcat_cl ...