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 ...

随机推荐

[置顶] 献给写作者的 Markdown 新手指南
作者:http://jianshu.io/p/q81RER 出处:http://jianshu.io/p/q81RER 献给写作者的 Markdown 新手指南简书「简书」作为一款「写作软件」在诞 ...
加减法计算器-java
由于经常进行较大数据的加减法计算,好多计算器都是转换成科学技术法的,所以自己用java写了一个功能如下: 1,可以输入多个带千位分隔符的数字,进行加减法计算 2,结果展示带千位分隔符 3,结果展示不 ...
Vue中的坑
今天给大家总结了Vue中的坑,都是平常踩到的,希望对大家有所帮助 1.vuex的一个“坑” 报错原因:在使用Vuex的时候在main.js中引入的时候对名字的大小写有区别解决法案: 错误写法: 正确 ...
php中mysqli 处理查询结果集总结
在PHP开发中,我们经常会与数据库打交道.我们都知道,一般的数据处理操作流程为接收表单数据数据入库 //连接数据库 $link = mysqli_connect("my_host&quo ...
聚类（Clustering）
简介相对于决策树.朴素贝叶斯.SVM等有监督学习,聚类算法属于无监督学习. 有监督学习通常根据数据集的标签进行分类,而无监督学习中,数据集并没有相应的标签,算法仅根据数据集进行划分. 由于具有出色的 ...
使用plsql创建package
1. 2.需要在packages中新建相同的包名:否则无法编译,报没有声明
JavaScript 常见创建对象的方式
JavaScript 有哪几种创建对象的方式? javascript创建对象简单的说,无非就是使用内置对象或各种自定义对象,当然还可以用JSON:但写法有很多种,也能混合使用. (1)对象字面量的方式 ...
js实现新闻滚动实例
<html> <head> <meta http-equiv="Content-Type" content="text/html; char ...
【codeforces 812B】Sagheer, the Hausmeister
[题目链接]:http://codeforces.com/contest/812/problem/B [题意] 一个老大爷在一楼; 然后他有n楼的灯要关(最多n楼); 每楼有m个房间; 给出每个房间的 ...
SQLSERVER-存储过程知识点
原文链接:http://www.qeefee.com/article/000566 存储过程是一组预编译的SQL语句,它可以包含数据操纵语句.变量.逻辑控制语句等. 存储过程允许带参数: 输入参数:可 ...

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

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

随机推荐

热门专题

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

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