zoukankan      html  css  js  c++  java
  • jquery 验证插件

    默认校验规则
    (1)required:true                必输字段
    (2)remote:"check.php"      使用ajax方法调用check.php验证输入值
    (3)email:true                    必须输入正确格式的电子邮件
    (4)url:true                        必须输入正确格式的网址
    (5)date:true                      必须输入正确格式的日期 日期校验ie6出错,慎用
    (6)dateISO:true                必须输入正确格式的日期(ISO),例如:2009-06-23,1998/01/22 只验证格式,不验证有效性
    (7)number:true                 必须输入合法的数字(负数,小数)
    (8)digits:true                    必须输入整数
    (9)creditcard:                   必须输入合法的信用卡号
    (10)equalTo:"#field"          输入值必须和#field相同
    (11)accept:                       输入拥有合法后缀名的字符串(上传文件的后缀)
    (12)maxlength:5               输入长度最多是5的字符串(汉字算一个字符)
    (13)minlength:10              输入长度最小是10的字符串(汉字算一个字符)
    (14)rangelength:[5,10]      输入长度必须介于 5 和 10 之间的字符串")(汉字算一个字符)
    (15)range:[5,10]               输入值必须介于 5 和 10 之间
    (16)max:5                        输入值不能大于5
    (17)min:10                       输入值不能小于10
     
     
     

    三、默认的提示
    messages: {
        required: "This field is required.",
        remote: "Please fix this field.",
        email: "Please enter a valid email address.",
        url: "Please enter a valid URL.",
        date: "Please enter a valid date.",
        dateISO: "Please enter a valid date (ISO).",
        dateDE: "Bitte geben Sie ein g眉ltiges Datum ein.",
        number: "Please enter a valid number.",
        numberDE: "Bitte geben Sie eine Nummer ein.",
        digits: "Please enter only digits",
        creditcard: "Please enter a valid credit card number.",
        equalTo: "Please enter the same value again.",
        accept: "Please enter a value with a valid extension.",
        maxlength: $.validator.format("Please enter no more than {0} characters."),
        minlength: $.validator.format("Please enter at least {0} characters."),
        rangelength: $.validator.format("Please enter a value between {0} and {1} characters long."),
        range: $.validator.format("Please enter a value between {0} and {1}."),
        max: $.validator.format("Please enter a value less than or equal to {0}."),
        min: $.validator.format("Please enter a value greater than or equal to {0}.")
    },

    如需要修改,可在js代码中加入:

    jQuery.extend(jQuery.validator.messages, {
      required: "必选字段",
      remote: "请修正该字段",
      email: "请输入正确格式的电子邮件",
      url: "请输入合法的网址",
      date: "请输入合法的日期",
      dateISO: "请输入合法的日期 (ISO).",
      number: "请输入合法的数字",
      digits: "只能输入整数",
      creditcard: "请输入合法的信用卡号",
      equalTo: "请再次输入相同的值",
      accept: "请输入拥有合法后缀名的字符串",
      maxlength: jQuery.validator.format("请输入一个 长度最多是 {0} 的字符串"),
      minlength: jQuery.validator.format("请输入一个 长度最少是 {0} 的字符串"),
      rangelength: jQuery.validator.format("请输入 一个长度介于 {0} 和 {1} 之间的字符串"),
      range: jQuery.validator.format("请输入一个介于 {0} 和 {1} 之间的值"),
      max: jQuery.validator.format("请输入一个最大为{0} 的值"),
      min: jQuery.validator.format("请输入一个最小为{0} 的值")
    });

    推荐做法,将此文件放入messages_cn.js中,在页面中引入
    <script src="../js/messages_cn.js" type="text/javascript"></script>

     

    五、常用方法及注意问题
    1.用其他方式替代默认的SUBMIT
    $().ready(function() {
     $("#signupForm").validate({
            submitHandler:function(form){
                alert("submitted");   
                form.submit();
            }    
        });
    });

    使用ajax方式

     $(".selector").validate({     
     submitHandler: function(form) 
       {      
          $(form).ajaxSubmit();     
       }  
     }) 

    可以设置validate的默认值,写法如下:
    $.validator.setDefaults({
     submitHandler: function(form) { alert("submitted!");form.submit(); }
    });

    如果想提交表单, 需要使用form.submit()而不要使用$(form).submit()

    2.debug,只验证不提交表单
    如果这个参数为true,那么表单不会提交,只进行检查,调试时十分方便

    $().ready(function() {
     $("#signupForm").validate({
            debug:true
        });
    });
    如果一个页面中有多个表单都想设置成为debug,用
    $.validator.setDefaults({
       debug: true
    })

    3.ignore:忽略某些元素不验证
    ignore: ".ignore"
    4.更改错误信息显示的位置
    errorPlacement:Callback

     Default: 把错误信息放在验证的元素后面 
    指明错误放置的位置,默认情况是:error.appendTo(element.parent());即把错误信息放在验证的元素后面 
    errorPlacement: function(error, element) {  
        error.appendTo(element.parent());  
    }

    rules  和 messages中用到的属性必名,必需是标签的 name 特性值(仅记)

  • 相关阅读:
    hdu5321 beautiful set(莫比乌斯反演)
    BZOJ 5104 Fib数列(二次剩余+BSGS)
    高次同余方程,二次同余方程学习笔记
    CF587F Duff is Mad(AC自动机+树状数组+分块)
    51nod 麦克打电话(AC自动机+树状数组)
    BZOJ 3881 [Coci2015]Divljak(AC自动机+树状数组)
    51nod 1526 分配笔名(Trie树+贪心)
    BZOJ 3790 神奇项链(回文自动机+线段树优化DP)
    CF666E Forensic Examination(后缀自动机+线段树合并)
    [HAOI2016]找相同字符(SAM+DP)
  • 原文地址:https://www.cnblogs.com/soofly/p/3460836.html
Copyright © 2011-2022 走看看