0

我有一个使用 jQuery Validation 插件的表单。表单域位于一系列折叠框中，并且表单错误消息显示在每个域的下方。这很好，除非该字段位于关闭的手风琴中，然后没有办法知道手风琴包含错误。

有没有办法将错误类应用于手风琴的标题？我知道我可以使用类似的东西

$("#form").validate({
    rules: {
    ...
    },
    highlight: function(element) {
        $(element).closest(".title").addClass("error");
    },
    unhighlight: function(element) {
        $(element).closest(".title").removeClass("error");
    }
});

以字段的容器为目标，但在这种情况下它不是父级。

我的手风琴结构如下。我需要将错误类应用于包含产生错误的字段的适当“标题”div。

<ul class="accordion">
    <li class="active">
        <div class="title panel1">
            Accordion Panel 1
        </div>
        <div class="content">
            ... form fields go here ...
        </div>
    </li>
    <li>
        <div class="title panel2">
            Accordion Panel 2
        </div>
        <div class="content">
            ... more form fields go here ...
        </div>
    </li>
    <li>
        <div class="title panel3">
            Accordion Panel 3
        </div>
        <div class="content">
            ... more form fields go here ...
        </div>
    </li>
</ul>

我也试过这个没有运气：

highlight: function(element) {
    $(element).closest(".title").addClass("error");
},
unhighlight: function(element) {
    $(element).closest(".title").removeClass("error");
}

有没有办法定位“标题”div？

4

1 回答 1

2

这里title元素是.content父元素的前一个兄弟元素

您可以使用

$(element).closest(".content").prev('.title').addClass("error");

或者

$(element).closest("li").children('.title').addClass("error");
于 2013-09-20T15:45:17.197 回答