jQuery.validator.addMethod添加自定义的验证规则

addMethod:name, method, message

简单实例:单个验证的添加

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>validate.js拓展验证</title>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script type="text/javascript" src="jquery.validate.js"></script>
<script type="text/javascript" src="validate.expand.js"></script>
</head>
<body>
<form action="" method="get" id="tinyphp">
<input type="text" value="" name="isZipCode" />
<input type="submit" value="提交" />
</form>
<script type="text/javascript">
$("#tinyphp").validate({
// 添加验证规则
rules: {
isZipCode: { //验证邮箱
isZipCode: true
}
}
});
</script>
</body>
</html>

validate.expand.js

jQuery.validator.addMethod("isZipCode", function(value, element) {
var tel = /^[0-9]{6}$/;
return this.optional(element) || (tel.test(value));
}, "请正确填写您的邮政编码");

 多个验证方法添加,请下载实例>>>>

=========================================================================

或看下面:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>validate.js拓展验证</title>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script type="text/javascript" src="jquery.validate.js"></script>
<script type="text/javascript" src="validate.expand.js"></script>
</head>
<body>
<form action="" method="get" id="tinyphp">
邮编:<input type="text" value="" name="isZipCode" /><br /><br /> 名字:<input type="text" value="" name="userName" />
<input type="submit" value="提交" />
</form>
<script type="text/javascript">
$("#tinyphp").validate({
// 添加验证规则
rules: {
isZipCode: { //验证邮箱
isZipCode: true
},
userName:{
required: true,
userName: true,
rangelength: [5,10]
}
}, //重设提示信息,可省略
messages:{
userName: {
required: "请填写用户名",
rangelength: "用户名必须在5-10个字符之间"
} }
});
</script>
</body>
</html>

validate.expand.js

jQuery.validator.addMethod("userName", function(value, element) {
return this.optional(element) || /^[\u0391-\uFFE5\w]+$/.test(value);
}, "用户名必须在5-10个字符之间"); jQuery.validator.addMethod("isZipCode", function(value, element) {
var tel = /^[0-9]{6}$/;
return this.optional(element) || (tel.test(value));
}, "请正确填写您的邮政编码");

jQuery:validate添加自定义验证的更多相关文章

  1. 封装jQuery Validate扩展验证方法

    一.封装自定义验证方法-validate-methods.js /***************************************************************** j ...

  2. jquery validate remote验证唯一性

    jquery.validate.js 的 remote 后台验证 之前已经有一篇关于jquery.validate.js验证的文章,还不太理解的可以先看看:jQuery Validate 表单验证(这 ...

  3. jquery validate扩展验证方法

    /***************************************************************** jQuery Validate扩展验证方法 (linjq) *** ...

  4. 扩展jquery.validate自定义验证,自定义提示,本地化

    <!DOCTYPE html> <html> <head> <meta name="viewport" content="wid ...

  5. 1)jquery validate 远程验证remote,自定义验证 , 手机号验证 2)bootstrap validate 远程remote验证的方法.

    1)jquery  validate 远程验证remote,自定义验证 1-1: js <script src="YYFramework/Public/js/jquery-3.1.1. ...

  6. jquery.validate.js 验证表单时,在IE当中未验证就直接提交的原因

    jquery.validate.js 验证表单时,在IE当中未验证就直接提交的原因 今天利用了jquery.validate.js来验证表单,发现在火狐.谷歌浏览器当中都可以进行验证,但是在IE系列浏 ...

  7. 使用tooltip显示jquery.validate.unobtrusive验证信息

    通过重写CSS实现使用tooltip显示jquery.validate.unobtrusive验证信息,效果如图: 1. 在ViewModel中定义验证规则 [Display(Name = " ...

  8. jQuery Validate Ajax 验证

    jQuery Validate Ajax 验证 <script type="text/javascript"> $(function() { $('#formCityL ...

  9. jQuery Validate扩展验证方法 (zhangxiaobin)

    /***************************************************************** jQuery Validate扩展验证方法 (zhangxiaob ...

随机推荐

  1. 4:django url

    一个干净的,优雅的URL 方案是一个高质量Web 应用程序的重要细节. 这节我们来看看django是如何做到干净优雅的url的 1:Django如何处理一个请求 通过ROOT_URLCONF决定根UR ...

  2. [PAT] 1142 Maximal Clique(25 分)

    1142 Maximal Clique(25 分) A clique is a subset of vertices of an undirected graph such that every tw ...

  3. kafka 设置消费者线程数

    http://blog.csdn.net/derekjiang/article/details/9053863 分布式发布订阅消息系统 Kafka 架构设计 - 目前见到的最好的Kafka中文文章 M ...

  4. mysql-备份及关联python

    阅读目录 IDE工具介绍 MySQL数据库备份 mysqldump实现逻辑备份 回复逻辑备份 备份/恢复案例 自动化备份 表的导出和导入 数据库迁移 pymysql模块 一 链接.执行sql.关闭(游 ...

  5. python 单例模式4中实现方法

    python实现单例模式的方法: 1. 使用模块 python的模块在第一次导入时会生成.pyc文件,当第二次导入时就会直接加载.pyc文件,而不会再次执行模块代码. 只需将其单独放在一个模块里,并创 ...

  6. redis之(二)redis单机的安装,配置,启动,关闭

    [1]下载redis压缩包,解压,编译

  7. stl 学习笔记

    1. Erasing multiple objects from a std::vector https://stackoverflow.com/questions/3487717/erasing-m ...

  8. 确实,k8s的时代,ingress负载用traefik比nginx方便啊

    参考文档: https://mritd.me/2016/12/06/try-traefik-on-kubernetes/#13ingress 由于微服务架构以及 Docker 技术和 kubernet ...

  9. 前端获得session信息方式对比,优化

    在开发中,页面 js 经常会遇到需要 当前登录用户信息(菜单权限,用户基本信息,配置信息) 的地方,一般情况我们可能对这些信息获取方式不是太在意,但是现在的前端通过webpack打包,即使做了代码分割 ...

  10. 【剑指offer】面试题 15. 二进制中 1 的个数

    面试题 15. 二进制中 1 的个数 题目描述 题目:输入一个整数,输出该数二进制表示中1的个数.其中负数用补码表示. Java 实现 方法一 public class Solution { // y ...