jQueryValidator自定义错误信息显示

阅读更多

jQuery.validator.addMethod("isAccount", function(value, element) {
    var reg = /^[a-zA-Z][\w]{6,10}$/;
    return this.optional(element) || (reg.test(value));
}, "账号必须是数字字母下划线6-10位!");

jQuery.validator.addMethod("checkPass", function(value, element) {
    var reg = /^[\w]{6,10}$/i;
    return this.optional(element) || (reg.test(value));
}, "密码必须为8-10位之间,包含数字字母下划线");

//数据验证
$("#reg").validate({
    debug:false,
    onkeyup: false, //禁用键盘抬起ajax请求

    //自定义错误消息位置
    errorLabelContainer:'ol.reg_error',
    wrapper:'li',

    //错误边框颜色
    highlight:function (element,errorClass) {
        $(element).css('border','1px solid #a94442')
    },
    //正确边框颜色
    unhighlight:function (element,errorClass) {
        $(element).css('border','1px solid #3c763d')
    },

    //自定义错误信息显示数目
    showErrors:function(errorMap,errorList) {
        //错误信息数量
        var errors = this.numberOfInvalids();

        if(errors > 0) {
            layer.style(index,{
                height:errors*20+380
            });
        } else {
            layer.style(index,{
                height:380
            });
        }

        //显示默认提示
        this.defaultShowErrors();
    },

    //数据提交
    submitHandler:function(form) {
       $(form).ajaxSubmit({
           type:"POST",
           dataType:"JSON",
           url:$(this).attr('action'),

           beforeSubmit:function (formData,jqForm,options) {
               $("button[type=submit]").html('登录中...').attr('disabled','disabled');
               layer.msg('数据验证中...', {icon: 16,shade: 0.01});
           },

           success:function (response,status) {

               var icon = response.status==202 ? 2 : 1;

               if(response.status==202 || response.status==200) {

                   layer.msg(response.message,{icon:icon});

                   $("button[type=submit]").html('登录').attr('disabled',false);

                   if(response.url!='') {
                       window.location.href=response.url;
                   }

                   //$("#login").resetForm(); 清空form表单值
               }
           },
           error:function (data) {
               layer.msg('网络错误!',{icon:2});
               $("button[type=submit]").html('登录').attr('disabled',false);
           }
       });
    },

    
    rules:{
        account:{
            required:true,
            isAccount:true,
            remote:{
                url:$("input[name=account]").attr('data-url'),
                type:"POST"
            }

        },
        password:{
            required:true,
            checkPass:true,
        },
        repassword:{
            required:true,
            equalTo:$("#pass")
        },
        code:{
            required:true,
            remote:{
                url:$("input[name=code]").attr('data-url'),
                type:"POST"
            }
        }
    },
    messages:{
        account:{
            required:'账号不能为空!',
            remote:'账号重复!'
        },
        password:{
            required:'密码不能为空!',
        },
        repassword:{
            required:'确认密码不能为空!',
            equalTo:"两次密码输入不一致!"
        },
        code:{
            required:"验证码不能为空!",
            remote:'验证码错误!'
        }
    }
});

转载于:https://my.oschina.net/u/3483680/blog/1823948