jQuery表单校验jquery.validate.js的使用(2)

下面是自定义的验证方式:

$.validator.addMethod("stringlength", function(value, element,params) {    

//默认值 : {trim:true,minLength:-1,maxLength:-1

    params = $.extend([true,-1,-1],params); //对于默认参数支持

    if(params[0]){  //过滤首尾空格

        value=$.trim(value);

    }

    value = value.replace(/<(?:.)*?>/g,""); //验证时过滤标签

    return this.optional(element) || ((params[1]<0 || value.length>=params[1])&&(params[2]<0 || value.length<=params[2]));

}, jQuery.format("长度在{1}-{2}之间"));

例如home工程中的登录校验:

$('#loginform').validate({//登陆校验

    rules:{

        "userAccount.userName":{

            "requiredstring":["true"],

            " requiredstring ":true,

            "stringlength":["true","3","40"]

        },

        "userAccount.userPwd":{

            "requiredstring":["true"],

            "stringlength":["true","1","20"]

        }

    },

    messages:{

        "userAccount.userName":{

            "requiredstring":"用户名必填",

            "stringlength":jQuery.format("用户名长度在{1}和{2}之间")

        },

        "userAccount.userPwd":{

            "requiredstring":"密码不可以为空",

            "stringlength":jQuery.format("密码长度在{1}和{2}之间")

        }

    }

})

userAccount.userName是页面对应的input的name,requiredstring、requiredstring、stringlength是自己定义的校验,定义在/image/hi/common/js/zxwvalidate.js里。

{1}、{2}等是rules里面对应验证方式的第几个元素,从0开始。

简单的实例:

$.validator.addMethod("twd", function(value, element,params) {    //默认值 : {trim:true,minLength:-1,maxLength:-1

          params = $.extend([true,-1,-1],params); //对于默认参数支持

          if(params[0]){

              value=$.trim(value);

          }

      })

      $("#test").validate({

          rules:{

              "nameput":{

                  "twd":[true,3,10]

              }  

          },

          messages:{

              "nameput":{

                  "twd":jQuery.format("长度在{1}和{2}之间")

              }

          }

})

4.其他注意事项

(1)校验默认是在点击提交submit的时候起作用.

(2)如果缺少$().ready(function() {  }),校验内容必须写在表单的后面。

(3)debug方法需要单独写或者rules和messages的后面,否则不会起作用。

附:

jQuery.Validate为我们提供了3种验证编写方式,各有优缺点:

(1)在input对象中书写class样式指定验证规则或属性验证规则:

如<input type=”text” class=”required”/>

内容版权声明:除非注明,否则皆为本站原创文章。

转载注明出处:https://www.heiqu.com/wwwwpd.html