如何在 jquery 验证中只隐藏默认错误信息？

Question

我有几个字段，对于出生日期字段，我想在需要时隐藏错误消息，但显示所有其他错误消息。我有以下隐藏所有错误消息的代码：

<input type="number" id="DayOfBirth" min="1" max="31" class="input error" name="DayOfBirth" placeholder="DD" aria-invalid="true">

JS：

rules = {
    DayOfBirth: required
};
messages = {
    DayOfBirth: "Required field is missing: Day of Birth"
};
$('#myForm').validate({
    rules: rules,
    messages: messages,
    errorPlacement: function (error, element) {
        if (element.attr("name") == "DayOfBirth") {
            error.hide();
        }
        else {
            error.insertAfter(element);
        };
    },
})

所以基本上我想隐藏默认错误消息 ("Required field is missing: Day of Birth") 但保留最小值和最大值的消息，我该怎么做？

Answer 1

你的全部问题都在这里...

messages = {
    // same message for ALL rules on this field
    DayOfBirth: "Required field is missing: Day of Birth"
};

这为名为 DayOfBirth 的字段上的所有规则定义了一条自定义消息。

然后就仅基于字段名称有条件地显示规则而言，这实际上工作得很好...

errorPlacement: function (error, element) {
    if (element.attr("name") == "DayOfBirth") { 
        error.hide();  // hide ALL messages for the matching field
    }
    else {
        error.insertAfter(element);
    };
},

但是，这将隐藏名为 DayOfBirth 的字段的所有消息。

换句话说，您为一个字段的所有规则设置了相同的自定义消息，然后隐藏了同一字段的 any/all 消息。没有意义。

如果您只想在一个特定字段上隐藏 required 规则的消息，则只需将其自定义消息设置为空白...

$(document).ready(function() {

    $('#myForm').validate({
        rules: {
            foo: {
                required: true,
                minlength: 5
            },
            bar: {
                required: true
            }
        },
        messages: {
            foo: {
                required: "",  // show nothing
                minlength: "foo too short"
            },
            bar: {
                required: "bar is required"
            }
        }
    })

});

演示：jsfiddle.net/e8jwLfb2/

就像 OP 在他的设置中一样；通过 .validate() 方法声明的规则与一些内联 HTML5 属性的混合。这是相同的解决方案，因为自定义消息是通过插件定义的：

演示 2：jsfiddle.net/bLn169h2/

使用 messages 对象时，您可以为字段上的每个规则设置自定义消息...

messages: {
    foo: {
        required: "custom required message for foo field",
        minlength:  "custom minlength message for foo field"
    }
}

或者对于整个字段...

messages: {
    foo: "custom message for all rules on foo field"
}

无论每条规则的声明方式或声明位置如何，此自定义消息都将覆盖。因此，在您的情况下，您在字段名称上定义了一条自定义消息，该消息将覆盖该字段上所有规则的所有验证消息。然后你在 errorPlacement 中有一个条件函数，它隐藏整个字段的 "the validation message"。同样，在何处声明规则并不重要，因为所有规则和消息都来自 jQuery 验证插件。

如何在 jquery 验证中只隐藏默认错误信息？

How to only hide the default error message in jquery validate?

jquery

jquery-validate