如何仅在 jquery validate 中隐藏默认错误消息？

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);
        };
    },
})

所以基本上我想隐藏默认错误消息（“缺少必填字段：出生日期”），但保留最小值和最大值的消息，我该怎么做？

Answer 1

你的整个问题都在这里......

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

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

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

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

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

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

---

如果您只想在一个特定字段上隐藏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"
    }
}

整个字段的OR...

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

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