当前位置: 代码迷 >> Web前端 >> 加快你的开发系列- 使用validate 校验器的心得
  详细解决方案

加快你的开发系列- 使用validate 校验器的心得

热度:147   发布时间:2012-11-03 10:57:44.0
加速你的开发系列- 使用validate 校验器的心得
1.rule 里面的设定的各个项是以name 做为关键字,莫以id做为唯一值。 谨记

2.jQuery.validator.format 的使用列子

$("button").click(function () {
      var str = "Hello {0}, this is {1}";
      alert("'" + str + "'");

      str = jQuery.validator.format(str, "World", "Bob");
      alert("'" + str + "'");
    });


使用自定义的校验方法 必须包含 id唯一确定的名字,校验function()及 返回验证信息
jQuery.validator.addMethod("domain", function(value, element) {
  return this.optional(element) || /^http:\/\/mycorporatedomain.com/.test(value);
}, "Please specify the correct domain for your documents");

3.即我们自定义这个方法后,然后在rule中相关的字段配置使用该方法

例子如下:
//可以在customerValidate.js 设定
jQuery.validator.addMethod("stringCheck", function(value, element) {      
     return this.optional(element) || /^[\u0391-\uFFE5\w]+$/.test(value);      
}, "只能包括中文字、英文字母、数字和下划线");  

rules: {  
         username: {  
             required:true,  
             stringCheck:true,  
             byteRangeLength:[3,15]    //注意:如这里
         },
},
/**//* 设置错误信息 */ 
messages: {  
username: {      
    required: "请填写用户名",  
    stringCheck: "用户名只能包括中文字、英文字母、数字和下划线",  
    byteRangeLength: "用户名必须在3-15个字符之间(一个中文字算2个字符)"  //注意:如这里  
}
}


4.使用group定义
http://docs.jquery.com/Plugins/Validation/validate#options
$(document).ready(function(){
    $("#myform").validate({
  groups: {
    username: "fname lname"
  },
  errorPlacement: function(error, element) {
     if (element.attr("name") == "fname"
                 || element.attr("name") == "lname" )
       error.insertAfter("#lastname");
     else
       error.insertAfter(element);
   },
   debug:true
})
  });


5。修改validate的成功的css
$("#myform").validate({
   success: "valid",
   submitHandler: function() { alert("Submitted!") }
})
  相关解决方案