从前面的示例中不难看出validate中自带的验证方法足以满足一般的要求,对于特别的要求可以使用addMethod(name,method,message)添加自定义的验证规则,下面的示例中添加了一个用于正则表达式验证的扩展验证的方法,示例如下:


<script type="text/javascript">
        jQuery.validator.addMethod("regex",  //addMethod第1个参数:方法名称
        function(value, element, params) {     //addMethod第2个参数:验证方法,参数(被验证元素的值,被验证元素,参数)
            var exp = new RegExp(params);     //实例化正则对象,参数为传入的正则表达式
            return exp.test(value);                    //测试是否匹配
        },
        "格式错误");    //addMethod第3个参数:默认错误信息
        $(function() {
            $("#signupForm").validate(             {
            rules: {
                txtPassword1: "required",  //密码1必填                 txtPassword2: {    //密码2的描述多于1项使用对象类型
                    required: true,  //必填,这里可以是一个匿名方法
                    equalTo: "#txtPassword1",  //必须与密码1相等
                    rangelength: [5, 10],    //长度5-10之间
                    regex: "^\\w+$"          //使用自定义的验证规则,在上例中新增的部分
                },                 txtEmail: "email"   //电子邮箱必须合法
            },
            messages: {
                txtPassword1: "您必须填写",                 txtPassword2: {
                    required: "您必须填写",
                    equalTo: "密码不一致",
                    rangelength: "长度必须介于{0} 和 {1} 之间的字符串",
                    regex: "密码只能是数字、字母与下划线"
                }
            },
            debug: false,  //如果修改为true则表单不会提交
            submitHandler: function() {
                alert("开始提交了");
            }
        });
    });
    </script>

运行结果:

注意,如果参数有多个可以使用数组,如regex:[1,3,5],方法中可以使用下标访问:params[0]

网友提供的一些扩展验证方法:
// 手机号码验证
jQuery.validator.addMethod("mobile", function(value, element) {
    var length = value.length;
    var mobile =  /^(((13[0-9]{1})|(15[0-9]{1}))+\d{8})$/
    return this.optional(element) || (length == 11 && mobile.test(value));
}, "手机号码格式错误");

// 电话号码验证   
jQuery.validator.addMethod("phone", function(value, element) {
    var tel = /^(0[0-9]{2,3}\-)?([2-9][0-9]{6,7})+(\-[0-9]{1,4})?$/;
    return this.optional(element) || (tel.test(value));
}, "电话号码格式错误");

// 邮政编码验证   
jQuery.validator.addMethod("zipCode", function(value, element) {
    var tel = /^[0-9]{6}$/;
    return this.optional(element) || (tel.test(value));
}, "邮政编码格式错误");

// QQ号码验证   
jQuery.validator.addMethod("qq", function(value, element) {
    var tel = /^[1-9]\d{4,9}$/;
    return this.optional(element) || (tel.test(value));
}, "qq号码格式错误");

// IP地址验证
jQuery.validator.addMethod("ip", function(value, element) {
    var ip = /^(?:(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)\.){3}(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)$/;
    return this.optional(element) || (ip.test(value) && (RegExp.$1 < 256 && RegExp.$2 < 256 && RegExp.$3 < 256 && RegExp.$4 < 256));
}, "Ip地址格式错误");

// 字母和数字的验证
jQuery.validator.addMethod("chrnum", function(value, element) {
    var chrnum = /^([a-zA-Z0-9]+)$/;
    return this.optional(element) || (chrnum.test(value));
}, "只能输入数字和字母(字符A-Z, a-z, 0-9)");

// 中文的验证
jQuery.validator.addMethod("chinese", function(value, element) {
    var chinese = /^[\u4e00-\u9fa5]+$/;
    return this.optional(element) || (chinese.test(value));
}, "只能输入中文");

// 下拉框验证
$.validator.addMethod("selectNone", function(value, element) {
    return value == "请选择";
}, "必须选择一项");

// 字节长度验证
jQuery.validator.addMethod("byteRangeLength", function(value, element, param) {
    var length = value.length;
    for (var i = 0; i < value.length; i++) {
        if (value.charCodeAt(i) > 127) {
            length++;
        }
    }
    return this.optional(element) || (length >= param[0] && length <= param[1]);
}, $.validator.format("请确保输入的值在{0}-{1}个字节之间(一个中文字算2个字节)"));

源码下载

JQuery扩展插件Validate—5添加自定义验证方法的更多相关文章

  1. jQuery form插件的使用--使用 fieldValue 方法校验表单

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <hea ...

  2. jQuery扩展插件以及正则相关函数练习

    一.jQuery扩展插件 二.相关正则函数:

  3. jQuery Validate自定义各种验证方法(转)

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

  4. Angular TypeScript开发环境集成jQuery扩展插件

    集成步骤: 1.安装jquery极其扩展插件库ts定义文件 npm install jquery --save npm install --save-dev @types/jquery npm ins ...

  5. jQuery扩展插件

    jQuery有多好用,大家有目共睹的,但是有时候不是每个功能都是万能的,有时候我们需要实现自己的功能,jQuery提供了很好的拓展功能,我们可以去拓展插件,更好的利用jQuery 查看官网,可知,有两 ...

  6. jquery 扩展插件方法

    分析插件jquery.countdown.js (function($) { $.fn.countdown = function(options) { // default options var d ...

  7. jquery.validate使用 - 自定义验证方法

    自定义jquery-validate的验证行为 1: 自定义表单提交 设置submitHandler来自定义表单提交动作 $(".selector").validate({    ...

  8. ASP.NET MVC jQuery 树插件在项目中使用方法(一)

    jsTree是一个 基于jQuery的Tree控件.支持XML,JSON,Html三种数据源.提供创建,重命名,移动,删除,拖"放节点操作.可以自己自定义创建,删 除,嵌套,重命名,选择节点 ...

  9. jQuery扩展$.fn、$.extend jQery命名方法扩展 练习总结

    <script> $.fn.hello = function(){  //扩展jQuery实例的自定义方法,基于$.fn的jq方法扩展     this.click(function(){ ...

随机推荐

  1. 使用Pig对手机上网日志进行分析

    在安装成功Pig的基础上.本文将使用Pig对手机上网日志进行分析,详细过程例如以下: 写在前面: 手机上网日志文件phone_log.txt.文件内容 及 字段说明部分截图例如以下 需求分析 显示每一 ...

  2. ubuntu环境eclipse配置

    ubuntu环境eclipse配置 首先下载Eclipse和JDK: 然后将上边两个压缩包解压到安装文件夹(如;/home/linux/softwares/java).然后配置/etc/profile ...

  3. idea分支合并

    1.切换到指定分支(例如dev) 2.点击master的merge进行合并 注意:最好删掉本地的master和dev然后重新拉下远程的master和dev生成最新的本地master和dev

  4. iOS开发 如何检查内存泄漏

    本文转载至 http://mobile.51cto.com/iphone-423391.htm 在开发的时候内存泄漏是不可避免的,但是也是我们需要尽量减少的,因为内存泄漏可能会很大程度的影响程序的稳定 ...

  5. EasyDarwin开源流媒体服务器gettimeofday性能优化(3000万/秒次优化至8000万次/秒)

    -本文由EasyDarwin开源团队成员贡献 一.问题描述 Easydarwin中大量使用gettimeofday来获取系统时间,对系统性能造成了一定的影响.我们来做个测试: While(1) { G ...

  6. 我们将要建立的EasyDarwin开源社区

    从12年12月我开始建立EasyDarwin开源项目,已经三年多的时间了,从开始最简单的一个开源流媒体服务器项目,如今已经发展成为目前国内最大的一个流媒体开源社区,截至目前已经有十几个项目在Githu ...

  7. 用EasyClient开源项目采集Windows摄像头/麦克风的音视频进行RTSP直播

    EasyClient是EasyDarwin开源流媒体团队开发的一款功能丰富的开源PC客户端项目,目前支持Windows.Android版本,后续将支持ios版本,其中Windows版本的EasyCli ...

  8. 从模版生成 uri Golang 的 html/template 包不太适合于这种情况

    模板 - Go/Golang 框架 Echo 文档 http://go-echo.org/guide/templates/ Templates | Echo - High performance, m ...

  9. BZOJ 2069 POI2004 ZAW 堆优化Dijkstra

    题目大意:给定一张无向图.每条边从两个方向走各有一个权值,求从点1往出走至少一步之后回到点1且不经过一条边多次的最短路 显然我们须要从点1出发走到某个和点1相邻的点上,然后沿最短路走到还有一个和点1相 ...

  10. NYOJ-37 回文字符串 —— LCS变形

    题目链接:http://acm.nyist.net/JudgeOnline/problem.php?pid=37 题解: 一开始想从两边向中间添加字符,发现这样不是最优的.因为加入字符之后,这些原本存 ...