为 jQuery 验证插件添加自定义错误条件和一般错误消息

Question

我正在开发一个应用程序解决方案，为我提供有限的页面空间，因此无法将包含的错误消息应用于每个必填字段。因此，我尝试创建一个解决方案，突出显示受影响的必填字段，并只为表单中的电子邮件地址、电话和密码等指定字段创建自定义消息。

我目前正在使用基本外壳（对于包含的消息工作正常）

    var v = $("form").validate({
        rules: {
            email: {
                required: true,
                email: true                 
            },
            confirmEmail: {
                required: true,
                email: true,
                equalTo: "#email"
            }
        },
        messages: {
            email: "Please enter a valid email address",
            confirmEmail: {
                required: "Please enter a valid verify email address",
                equalTo: "Both email addresses must be the same."
            }
        },
        errorContainer: errcontainer,
        errorLabelContainer: $("ol", errcontainer),
        wrapper: 'li',
        onkeyup: false,
        onblur: false
    });     

提前感谢您的任何帮助或建议。

Answer 1

您想要做的是在验证插件中实现 showErrors 挂钩。

您会收到错误消息的映射，然后会收到与生成这些消息的表单元素关联的相同消息的数组。

那么，您最好的选择是复制默认处理程序（在验证插件中称为 defaultShowErrors）并对其进行稍微修改（以仅显示您关心的标签）。

然后，您的验证选项中就会有类似这样的内容：

showErrors: function(errorMap, errorList) {
    for (var i = 0; this.errorList[i]; i++) {
        var error = this.errorList[i];
        //this is the only real part you modify
        if (error.element.id == 'email' || error.element.id == 'confirmEmail') {
            this.showLabel(error.element, error.message);
        }
        this.settings.highlight && this.settings.highlight.call(this, error.element, this.settings.errorClass, this.settings.validClass);
    }
    //a whole bunch more stuff after this, from jquery.validate.js
}

在此处查看此想法的实际应用：http://jsfiddle。网/ryleyb/D3tfu/