Nice Jquery Validator 自定义规则
规则定义方式
(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 自定义规则的更多相关文章
- jQuery.validator 验证规则详解
前言:jQuery.validator是一款非常不错的表单验证插件,验证方式非常简单方便,它还对HTML5做了兼容处理,了解了验证规则,就基本掌握了它的使用,下面就让我一一道来 jQuery.vali ...
- jQuery validator自定义
项目中接触到validator,记录下 jQuery.validator.addMethod("isStrongPwd", function(value, element){ va ...
- jquery validate自定义规则
//检查身份证号码是否存在 $.validator.addMethod("checkIDCardExist", function (value, element) { if ($( ...
- Nice Jquery Validator 常用规则整理
一些简单规则 numeric: [/^[0-9]*$/, '请填写数值'], money: [/^(?:0|[1-9]\d*)(?:\.\d{1,2})?$/, "请填写有效的金额" ...
- jQuery.validator 详解二
前言:上一篇详细的介绍了jQuery.validator( 版本v1.13.0 )的验证规则,这一篇重点讲述它的源码结构,及如何来对元素进行验证,错误消息提示的内部实现 一.插件结构(组织方式) 在讲 ...
- jQquery.validate自定义规则的使用案例
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- jQuery.validator 详解
jQuery.validator 详解二 前言:上一篇详细的介绍了jQuery.validator( 版本v1.13.0 )的验证规则,这一篇重点讲述它的源码结构,及如何来对元素进行验证,错误消息提示 ...
- jQuery.Validate自定义规程的使用案例
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- jquery validate自定义checkbox验证规则和样式
参考:http://blog.csdn.net/xh16319/article/details/9987847 自定义checkbox验证,“检查checkbox是否选中” jQuery.valida ...
随机推荐
- javaWeb普通类获取ApplicationContext
网上看了很多关于获取ApplicationContext的方法,五大方法,但是我用web服务使用成功的就这一个,自己记忆下. import javax.servlet.ServletContextEv ...
- 安装的SQL Server2008 R2版的连接不到本地数据,提示未找到或无法访问服务器。----复制自百度知道
安装的SQL Server2008 R2版的连接不到本地数据,提示未找到或无法访问服务器.使用Windows身份验证 2012-09-17 00:23hj168926 | 分类:数据库DB | 浏览3 ...
- 最优化之Robust PCA
最近加了一个QQ群,接触了点新的东西,包括稀疏近似,低秩近似和压缩感知等.Robust PCA中既包含了低秩,又包含了稀疏,于是以其为切入点,做了如下笔记.笔记中有的公式有比较详细的推导,希望对读者有 ...
- Java——java.lang.NullPointerException
JavaCompiler compiler = ToolProvider.getSystemJavaCompiler(); StandardJavaFileManager fileManager = ...
- 一文讲透Modbus协议
前言 Modbus是一种串行通讯协议,是Modicon公司(现在的施耐德电气 Schneider Electric) 于1979年为使用可编程逻辑控制器(PLC)通信而发表.Modbus已经成为工业领 ...
- WordPress 安全配置
关闭后台主题编辑功能 WordPress后台的主题一旦权限开放就可以在后台直接编辑,如果没有开放则只可浏览.主机若有安装suPHP默认就是可以编辑.如果你觉得这项功能用不到,建议您可以关闭它,毕竟直接 ...
- [自动化-脚本]001.自动领淘金币:Anyweb模拟操作
通过模拟手工操作的方法领取淘金币.该方法万能且通用,有能力的还可以自行修改脚本. 工具 软件下载 anywebscript.com 方法/步骤 1.安装软件如图所示 2.设置脚本: (1)进入网站:[ ...
- [转]前人挖坑,后人填坑—如何把那些bug挖掘出来
当我们放下一个项目转投下一个时,手头的东西就要转交给他人处理,或者..不再有人处理,可代码还在那里,搞不好你就引用了别人的东西,保不准哪天别人的代码里就爆出了个大 bug,当然这里的“别人”也可能是 ...
- MANIFEST.MF是个什么?
MANIFEST.MF是个什么? 写这篇文件主要记录JRA文件里面到底是什么?然后MANIFEST.MF又是什么?Springboot 如何只有Main方法就可以运行的? Springboot项目打包 ...
- bootstrap table Showing 1 to 5 of 5 rows 页码显示英文
注意导包先后顺序bootstrap-table-zh-CN.js链接:https://cdn.bootcdn.net/ajax/libs/bootstrap-table/1.16.0/locale/b ...