jquery.validate动态更改校验规则【转】

有时候表单中有多个字段是相互关联的，以下遇到的就是证件类型和证件号码的关联，在下拉框中选择不同的证件类型，证件号码的值的格式都是不同的，这就需要动态的改变校验规则。

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

<html>

<head>

<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">

<script src="jquery-1.7.2.js" type="text/javascript"></script>

<script src="jquery.validate.js" type="text/javascript"></script>

<script src="validate.addmethod.js" type="text/javascript"></script>

<script src="messages_zh.js" type="text/javascript"></script>

<script type="text/javascript">

//===================放在validate.addmethod.js中=========================

//检查号码是否符合规范，包括长度，类型

isCardNo = function(card)

{

    //身份证号码为15位或者18位，15位时全为数字，18位前17位为数字，最后一位是校验位，可能为数字或字符X

    var reg = /(^\d{15}$)|(^\d{17}(\d|X)$)/;

    if(reg.test(card) === false)

    {

        return false;

    }

    return true;

};

//取身份证前两位,校验省份

checkProvince = function(card)

{

    var province = card.substr(0,2);

    if(vcity[province] == undefined)

    {

        return false;

    }

    return true;

};

//检查生日是否正确

checkBirthday = function(card)

{

    var len = card.length;

    //身份证15位时，次序为省（3位）市（3位）年（2位）月（2位）日（2位）校验位（3位），皆为数字

    if(len == '15')

    {

        var re_fifteen = /^(\d{6})(\d{2})(\d{2})(\d{2})(\d{3})$/;

        var arr_data = card.match(re_fifteen);

        var year = arr_data[2];

        var month = arr_data[3];

        var day = arr_data[4];

        var birthday = new Date('19'+year+'/'+month+'/'+day);

        return verifyBirthday('19'+year,month,day,birthday);

    }

    //身份证18位时，次序为省（3位）市（3位）年（4位）月（2位）日（2位）校验位（4位），校验位末尾可能为X

    if(len == '18')

    {

        var re_eighteen = /^(\d{6})(\d{4})(\d{2})(\d{2})(\d{3})([0-9]|X)$/;

        var arr_data = card.match(re_eighteen);

        var year = arr_data[2];

        var month = arr_data[3];

        var day = arr_data[4];

        var birthday = new Date(year+'/'+month+'/'+day);

        return verifyBirthday(year,month,day,birthday);

    }

    return false;

};

//校验日期

verifyBirthday = function(year,month,day,birthday)

{

    var now = new Date();

    var now_year = now.getFullYear();

    //年月日是否合理

    if(birthday.getFullYear() == year && (birthday.getMonth() + 1) == month && birthday.getDate() == day)

    {

        //判断年份的范围（3岁到100岁之间)

        var time = now_year - year;

        if(time >= 3 && time <= 100)

        {

            return true;

        }

        return false;

    }

    return false;

};

//校验位的检测

checkParity = function(card)

{

    //15位转18位

    card = changeFivteenToEighteen(card);

    var len = card.length;

    if(len == '18')

    {

        var arrInt = new Array(7, 9, 10, 5, 8, 4, 2, 1, 6, 3, 7, 9, 10, 5, 8, 4, 2);

        var arrCh = new Array('1', '0', 'X', '9', '8', '7', '6', '5', '4', '3', '2');

        var cardTemp = 0, i, valnum;

        for(i = 0; i < 17; i ++)

        {

            cardTemp += card.substr(i, 1) * arrInt[i];

        }

        valnum = arrCh[cardTemp % 11];

        if (valnum == card.substr(17, 1))

        {

            return true;

        }

        return false;

    }

    return false;

};

//15位转18位身份证号

changeFivteenToEighteen = function(card)

{

    if(card.length == '15')

    {

        var arrInt = new Array(7, 9, 10, 5, 8, 4, 2, 1, 6, 3, 7, 9, 10, 5, 8, 4, 2);

        var arrCh = new Array('1', '0', 'X', '9', '8', '7', '6', '5', '4', '3', '2');

        var cardTemp = 0, i;

        card = card.substr(0, 6) + '19' + card.substr(6, card.length - 6);

        for(i = 0; i < 17; i ++)

        {

            cardTemp += card.substr(i, 1) * arrInt[i];

        }

        card += arrCh[cardTemp % 11];

        return card;

    }

    return card;

};

isIdCardNo = function(card)

{

    //是否为空

    if(card === '')

    {

        return false;

    }

    //校验长度，类型

    if(isCardNo(card) === false)

    {

        return false;

    }

    //检查省份

    if(checkProvince(card) === false)

    {

        return false;

    }

    //校验生日

    if(checkBirthday(card) === false)

    {

        return false;

    }

    //检验位的检测

    if(checkParity(card) === false)

    {

        return false;

    }

    return true;

};

    // 身份证号码验证

    jQuery.validator.addMethod("isIdCardNo", function(value, element) {

     return this.optional(element) || isIdCardNo(value);

    }, "请正确输入您的身份证号码");

    // 护照号格式验证

    jQuery.validator.addMethod("isPassport", function(value,element) {

          var passport = "/(P/d{7})|(G/d{8})/";

         return this.optional(element) || (passport.test(value));

        }, "请正确填写您的护照号");

//===================放在validate.addmethod.js中END=========================

$(document).ready(function() {

    $("#ctc_form").validate({

        ignore: "", // 开启hidden验证， 1.9版本后默认关闭

        rules: {

            "qq": {

                required: true,

                //minlength: 2

                stringCheck:true

            }

        }

    });

    $("#papersType").change( function() {

        var type = $("#papersType").find("option:selected").text();

        if(type=="身份证"){

            $("#papersCode").rules("remove");

            $("#papersCode").rules("add", { required: true,isIdCardNo: true, messages: { required: "请正确输入您的身份证号码"} });

        }else if(type == "军官证"){

            $("#papersCode").rules("remove");

            $("#papersCode").rules("add", { required: true,stringCheck:true,minlength:6,maxlength:8, messages: { required: "请输入正确的军官证号"} });

        }else if(type == "护照"){

            $("#papersCode").rules("remove");

            $("#papersCode").rules("add", { required: true,isPassport:true, messages: { required: "请正确填写您的护照号"} });

        }else if(type == "机动车驾驶证"){

            $("#papersCode").rules("remove");

            $("#papersCode").rules("add", { required: true,stringCheck:true, messages: { required: "机动车驾驶证是必填"} });

        }else{

            $("#papersCode").rules("remove");

            $("#papersCode").rules("add", { required: true,stringCheck:true, messages: { required: "必填"} });

        }

    });

});

</script>

<title></title>

</head>

<body>

  <div class="m_right">

    <form id="ctc_form" method="post" action="">

        <table width="700" border="0" cellspacing="0" cellpadding="0" align="center" style="border-collapse: collapse;border-spacing: 0; border:0;margin:0px auto;">

              <tr>

                <td width="90" class="m_r_s_con_td"><span class="required_mark">*</span>证件类型 </td>

                <td width="275" class="m_r_s_con_text"><label for="select"></label>

                  <select name="papersType" id="papersType">

                    <option value="0">请选择</option

                    <option value="1">身份证</option>

                    <option value="2">军官证</option>

                    <option value="3">护照</option>

                    <option value="4">机动车驾驶证</option>

                    <option value="5">其他</option>

                </select></td>

                <td class="m_r_s_con_text"></td>

              </tr>

              <tr>

                <td width="90" class="m_r_s_con_td"><span class="required_mark">*</span>证件证号 </td>

                <td width="275" class="m_r_s_con_text"> 

                <input name="papersCode" id="papersCode"/>

                </td>

                <td class="m_r_s_con_text"></td>

              </tr>

              <tr>

                <td width="90" class="m_r_s_con_td"><span class="required_mark">*</span>QQ </td>

                <td width="275" class="m_r_s_con_text"> 

                <input name="qq" id="qq"/>

                </td>

                <td class="m_r_s_con_text"></td>

              </tr>

         </table>

      <input type="submit" value="添加" />

    </form>

  </div>

</body>

</html>

　　转自：http://blog.chinaunix.net/uid-20690917-id-3381743.html

jquery.validate动态更改校验规则【转】的更多相关文章

jquery.validate动态更改校验规则
有时候表单中有多个字段是相互关联的,以下遇到的就是证件类型和证件号码的关联,在下拉框中选择不同的证件类型,证件号码的值的格式都是不同的,这就需要动态的改变校验规则. 点击(此处)折叠或打开 <! ...
jQuery Validate 验证，校验规则写在控件中的具体例子
将校验规则写到控件中 <script src="../js/jquery.js" type="text/javascript"></scrip ...
Jquery Validate 动态添加校验
<cx:script> <script type="text/javascript"> //修改表单验证,提交 $(document).ready(func ...
jQuery Validate 表单验证插件----利用jquery.metadata.js将校验规则直接写在class属性里面并定义错误信息的提示
一.下载依赖包网盘下载:https://yunpan.cn/cryvgGGAQ3DSW 访问密码 f224 二. 添加一个另外一个插件jquery.metadata.js 并把校验规则写在控件里面 ...
使用JQuery.Validate插件来校验页面表单有效性
使用JQuery.Validate插件来校验页面表单有效性1. [代码] 常见的注册表单元素 <form action="#" method="post" ...
bootstrap+jQuery.validate表单校验
谈谈表单校验这大概是一种惯例,学习前台后台最开始接触的业务都是用户注册和登录.现在社会坚持以人为本的理念,在网站开发过程同样如此.User是我们面对较多的对象,也是较核心的对象.最开始的用户注册和登 ...
jQuery.validate表单校验+bootstrap
谈谈表单校验这大概是一种惯例,学习前台后台最开始接触的业务都是用户注册和登录.现在社会坚持以人为本的理念,在网站开发过程同样如此.User是我们面对较多的对象,也是较核心的对象.最开始的用户注册和登 ...
Jquery Validate动态添加和删除校验规则
以下面文本框为例, <input type="text"name="username" id="username"/> 我们要让 ...
jQuery.validate 的form校验
jQuery验证框架 : 基本html代码: <script src="js/jquery-1.9.1.js"></script> <script s ...

随机推荐

WePy--记录使用过程中的一些坑
讲真, 官方文档还是要好好看, 都是细节啊... 1- 使用wepy框架中封装好的小程序api <wepy 对小程序的API进行Promise处理> ①: 首先需要声明开启使用we ...
sort函数用法详解
用于C++中,对给定区间所有元素进行排序.头文件是#include <algorithm> sort函数进行快速排序,时间复杂度为n*log2n,比冒泡之类的要省时不少 Sort函数使用模 ...
vivo输入法需求分析
我使用的输入法:vivo输入法 1,用户界面:界面为白色和灰色,整体简洁大方,个人而言外观挺不错.但是不能自定义界面,更改背景图片或是主题. 2,记住用户选择:可记忆上次使用后的键盘方式(26键或是9 ...
Shiro：授权的相关实现
Shiro:授权的相关实现一.使用Shiro过滤器实现授权设置好授权拦截跳转的请求地址 /** * 创建ShiroFilterFactoryBean */ @Bean public ShiroFi ...
ucore_lab1
练习1:理解通过make生成执行文件的过程.(要求在报告中写出对下述问题的回答) 实验过程静态分析代码. 实验的目录结构如下: . ├── boot ├── kern │ ├── debug │ ...
JavaCodeTra 36选7 彩票抽奖
想写个小代码试试自己的运气.然并卵.并不能猜中 import java.util.Random; import java.util.Scanner; /** * */ /** * @author Ha ...
HDU 4339 Contest 4
树状数组,主要是抓住要求连续1的个数.这样,初始时,相同的加1,不同的加0. 查询时,用二分搜索右边界.就是比较当前mid-l+1的值与他们之间1的个数(这可以通过树状数组求区间和得出),记录右边界即 ...
【转载】tslib移植_freescale imx6
本文来自网络:http://blog.csdn.net/xishuang_gongzi/article/details/49422879 环境:host:Ubuntu12.04target:frees ...
Android多媒体学习六：利用Service实现背景音乐的播放
Android同意我们使用Service组件来完毕后台任务.这些任务的同意不会影响到用户其它的交互. 1.Activity类 [java] view plaincopy package demo.ca ...
what's new in vc2015
1. 变量和函数的注解提示非常实用.象C#了. 2.CStdioFile升级了,不再须要象 vc2013中,用CStdioFileEx来修复错误了. 3. 发现再写.

jquery.validate动态更改校验规则 【转】

jquery.validate动态更改校验规则 【转】的更多相关文章

随机推荐

热门专题

jquery.validate动态更改校验规则【转】

jquery.validate动态更改校验规则【转】的更多相关文章