如何在 onfocusout 函数中获取有关输入字段模糊的错误消息

Question

我只是想在我的一个小项目中使用 validate.js，给我印象最深的是这个插件给你的定制选项的数量，现在我真正想做的是，我有以下验证码：

$('#testimonials-form').validate({
        rules: {
            "t-title": {
                required: true,
                minlength: 5
            },
            "t-text": {
                required: true,
                minlength: 15
            },
            "person-name": {
                required: true,
                minlength: 4
            },
            "photo": {
                required: true,
                accept: 'image/*'
            }
        },
        messages: {
            "t-title": {
                required: "A title is needed",
                minlength: "minimum 4 characters"
            },
            "t-text": {
                required: "A testimonial is needed",
                minlength: "minimum 15 characters"
            },
            "person-name": {
                required: "A name is needed",
                minlength: "minimum 4 characters"
            },
            "photo" : {
                required: "An image for the testimonial giver is needed",
                accept: "Only image file type is accpeted , please check that the file you tried to upload was an image"
            }
        },

        submitHandler: function(form) {
                return false;
        },

    });

现在每次我聚焦在一个输入字段上，并且没有满足验证条件时，错误会显示在输入字段的底部，我想要的是自定义的错误消息，所以我遇到了以下功能在文档 HERE 中， onfocusout 函数，现在如果我像下面这样使用该函数：

        onfocusout: function(e , b) {
          var exe = e.target;
          var b = null;
        }

默认验证消息停止出现，但我如何在 onfocusout 函数中获取错误消息，以便我可以在我的自定义 HTML 中显示错误，即以下错误消息：

messages: {
            "t-title": {
                required: "A title is needed",
                minlength: "minimum 4 characters"
            },
            "t-text": {
                required: "A testimonial is needed",
                minlength: "minimum 15 characters"
            },
            "person-name": {
                required: "A name is needed",
                minlength: "minimum 4 characters"
            },
            "photo" : {
                required: "An image for the testimonial giver is needed",
                accept: "Only image file type is accpeted , please check that the file you tried to upload was an image"
            }
        },

插件传给onfocusout函数的两个参数是：

元素。
事件对象。

（在控制台中检查了以上内容。）

所以我的问题是，如何获取有关输入字段模糊的错误消息？还是不可能？

Answer 1

onfocusout 默认启用。但是，默认情况下验证是 "lazy"。这意味着在第一次单击提交之前，在字段中使用 Tab 键不会执行任何操作。请参见第二个要点 here。

Before a field is marked as invalid, the validation is lazy: Before submitting the form for the first time, the user can tab through fields without getting annoying messages – they won't get bugged before having the chance to actually enter a correct value

先点击提交然后查看onfocusout功能...

默认：http://jsfiddle.net/31fjzogp/

当您在对象文字中指定 onfocusout 选项时，您将完全覆盖默认功能。

我不确定你在这里发生了什么...

onfocusout: function(e , b) {
    var exe = e.target;
    var b = null;
}

根据源代码，开发人员只为该函数提供一个参数，因此 b 不会为您做任何事情。即使 b 是事件对象，将其设置为 null 也无济于事。基本上，您的自定义函数只是完全禁用 onfocusout。

So my question is , how do i get the error message on blur of the input field ? or is it not possible ?

将 onfocusout 从 "lazy" 切换到 "eager"...

onfocusout: function(element) {
    this.element(element);
}

演示：http://jsfiddle.net/3pLr49rs/

The default validation message stops appearing, but than how do i get the error message inside the onfocusout function, so that i can display the error in my customized HTML.

当您破坏默认的 onfocusout 功能时，它们不再出现，并且您不会将消息放在的onfocusout 函数。

如您所见，messages 选项在您实施后效果很好：http://jsfiddle.net/3pLr49rs/1/

要自定义消息容器的位置或 HTML，您可以使用 errorPlacement, errorElement, etc. See: http://jsfiddle.net/3pLr49rs/2/

等选项

如何在 onfocusout 函数中获取有关输入字段模糊的错误消息

How to get the error message on blur of input field inside onfocusout function

jquery

jquery-validate