jQuery驗證插件-如何將錯誤消息添加到標題屬性？

Question

我到處尋找這個問題的答案，雖然有很多相似的問題，但沒有一個完全像我想要的那樣。

我正在將JQuery Validator插件用於Web表單。 由於設計限制，我不希望將錯誤消息附加到上一個元素。 目前，我使用它在無效的輸入中添加特定類，使用突出顯示以及在表單底部添加摘要。 沒有問題。

但是，我發現單憑這一點是不夠的，因為用戶真的還不知道為什么特定的地點無效。 我真的沒有空間可以自動顯示錯誤消息； 但是，我在文檔中讀到你可以將錯誤消息添加到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等）。 顯然，您需要針對每個錯誤執行此操作。