一块促、導(dǎo)入js庫(kù)

<script type="text/javascript" src="<%=basePath%>lib/jquery/1.9.1/jquery.min.js"></script> 
<script type="text/javascript" src="<%=basePath%>lib/jquery.validation/1.14.0/jquery.validate.js"></script>
<script type="text/javascript" src="<%=basePath%>lib/jquery.validation/1.14.0/validate-methods.js"></script>
<script type="text/javascript" src="<%=basePath%>lib/jquery.validation/1.14.0/messages_zh.js"></script>

注：<%=basePath%>表示項(xiàng)目根目錄

二论巍、jQuery默認(rèn)校驗(yàn)規(guī)則

(1)抢蚀、required:true               必輸字段
(2)渠旁、remote:"remote-valid.jsp"   使用ajax方法調(diào)用remote-valid.jsp驗(yàn)證輸入值
(3)攀例、email:true                  必須輸入正確格式的電子郵件
(4)、url:true                    必須輸入正確格式的網(wǎng)址
(5)顾腊、date:true                   必須輸入正確格式的日期粤铭，日期校驗(yàn)ie6出錯(cuò)，慎用
(6)杂靶、dateISO:true                必須輸入正確格式的日期(ISO)梆惯，例如：2009-06-23，1998/01/22 只驗(yàn)證格式吗垮，不驗(yàn)證有效性
(7)垛吗、number:true                 必須輸入合法的數(shù)字(負(fù)數(shù)，小數(shù))
(8)烁登、digits:true                 必須輸入整數(shù)
(9)怯屉、creditcard:true             必須輸入合法的信用卡號(hào)
(10)、equalTo:"#password"        輸入值必須和#password相同
(11)饵沧、accept:                    輸入擁有合法后綴名的字符串（上傳文件的后綴）
(12)锨络、maxlength:5                輸入長(zhǎng)度最多是5的字符串(漢字算一個(gè)字符)
(13)、minlength:10               輸入長(zhǎng)度最小是10的字符串(漢字算一個(gè)字符)
(14)狼牺、rangelength:[5,10]         輸入長(zhǎng)度必須介于 5 和 10 之間的字符串")(漢字算一個(gè)字符)
(15)羡儿、range:[5,10]               輸入值必須介于 5 和 10 之間
(16)、max:5                      輸入值不能大于5
(17)锁右、min:10                     輸入值不能小于10

三失受、中文提示代碼

$.extend($.validator.messages, {
    required: "這是必填字段",
    remote: "請(qǐng)修正此字段",
    email: "請(qǐng)輸入有效的電子郵件地址",
    url: "請(qǐng)輸入有效的網(wǎng)址",
    date: "請(qǐng)輸入有效的日期",
    dateISO: "請(qǐng)輸入有效的日期 (YYYY-MM-DD)",
    number: "請(qǐng)輸入有效的數(shù)字",
    digits: "只能輸入數(shù)字",
    creditcard: "請(qǐng)輸入有效的信用卡號(hào)碼",
    equalTo: "你的輸入不相同",
    extension: "請(qǐng)輸入有效的后綴",
    maxlength: $.validator.format("最多可以輸入 {0} 個(gè)字符"),
    minlength: $.validator.format("最少要輸入 {0} 個(gè)字符"),
    rangelength: $.validator.format("請(qǐng)輸入長(zhǎng)度在 {0} 到 {1} 之間的字符串"),
    range: $.validator.format("請(qǐng)輸入范圍在 {0} 到 {1} 之間的數(shù)值"),
    max: $.validator.format("請(qǐng)輸入不大于 {0} 的數(shù)值"),
    min: $.validator.format("請(qǐng)輸入不小于 {0} 的數(shù)值")
});

四讶泰、校驗(yàn)規(guī)則js代碼

$("#demoform").validate({
        rules:{
            school:{
                required:true
            },
            classes:{
                required:true,
                digits:true
            },
            name:{
                required:true
            },
            studentId:{
                required:true,
                digits:true
            },
            mac:{
                required:true,
                macCheck:true
            },
            province:{
                required:true,
            },
            city:{
                required:true,
            },
            district:{
                required:true,
            }
        },
        onkeyup:false,
        focusCleanup:true,
        success:"valid",
        submitHandler:function(form){
            $("#modal-shenqing-success").modal("show");
            $(form).ajaxSubmit(function(data){
                if(data.statusCode == 1){
                    $.Huimodalalert('學(xué)生數(shù)據(jù)錄入成功',3000)
                }else{
                    $.Huimodalalert('學(xué)生信息錄入失敗',3000)
                }
            });
        }
    });

五、自定義校驗(yàn)規(guī)則

$(function () {
//自定義校驗(yàn)規(guī)則
    jQuery.validator.addMethod(
        "macCheck",function(value,element){
            var mac = /[A-F\d]{2}:[A-F\d]{2}:[A-F\d]{2}:[A-F\d]{2}:[A-F\d]{2}:[A-F\d]{2}/;
            return this.optional(element)||(mac.test(value));
        },
    "請(qǐng)輸入正確的mac地址")
}