Question

我到处寻找这个问题的答案，虽然有很多类似的问题，但没有一个像我想要的那样完成。

我正在为webform使用JQuery Validator插件。由于设计约束，我不希望将错误消息附加到前一个元素。目前，我使用它在无效的输入中添加特定类，使用突出显示以及在表单底部添加摘要。没问题。

但是，我发现单凭这一点还不够，因为用户真的还不知道为什么特定的地点无效。我真的没有空间自动显示错误信息;但是，我在文档中读到你可以将错误消息添加到title属性，这就是我想要做的。引自，网站：

错误消息显示用户有关无效元素的提示，以及出错的地方。有三种方法可以提供错误消息。通过输入元素的title属性进行验证，通过错误标签和插件设置（选项消息）。

但是，它没有显示如何将错误消息实际添加到title属性。那么，到目前为止，这是我在这种情况下能做些什么呢？

仅供参考：我意识到我必须重新添加错误消息，而不是使用“”作为消息。

$(document).ready(function() {
    $("#popcornOrder").validate({
            rules: {
                fName:      "required",
                lName:      "required",
                street:     "required",
                city:       "required",
                state:      "required",
                zip:        {required: true, ziprange: true},
                accountNum: "required",
                email:      {required: true, email: true},
                pwd:        "required",
                confPwd:    {required: true, equalTo: "#pwd"},
                payment:    "required"
            },
            messages: {
                fName:      "",
                lName:      "",
                street:     "",
                city:       "",
                state:      "",
                zip:        "",
                accountNum: "",
                email:      "",
                pwd:        "",
                confPwd:    "",
                payment:    ""

            },
            highlight:
                function(element) {
                    $(element).addClass('errorBorder');
                },
            unhighlight:
                function(element) {
                    $(element).removeClass('errorBorder');
                },
            invalidHandler: function(form, validator) {
                var errors = validator.numberOfInvalids();
                    if (errors) {
                         var message = errors == 1
                            ? 'You missed 1 field. It has been highlighted'
                            : 'You missed ' + errors + ' fields. They have been highlighted';
                         $("div.error span").html(message);
                         $("div.error").show();
                         } else {
                        $("div.error").hide();
                    }
             },
             focusInvalid: false
    });
});

编辑：好的，我确实更近了一步：如果我添加以下行，它将向title属性添加一条消息（这只是常规的OL JQuery），但是它将消息摘要添加到所有标题。那么，真正的问题是如何将特定错误添加到每个输入中？

$("input").attr("title", message);

Answer 1

你试过这个吗？

errorPlacement: 
    function(error, element) {
        $(element).prop("title", error.text());
    },

并删除它......

unhighlight:
    function(element) {
        $(element).removeClass('errorBorder').prop("title", "");
    },

Answer 2

您需要唯一标识输入。

$("input[name=foo]").attr("title", message);

其中foo是输入的名称。我怀疑这将与被破坏的规则的名称（例如fName，lName等）一致。显然，你需要为每个错误做到这一点。

JQuery Validation Plugin - 如何向Title Attribute添加错误消息？

2 个答案: