2

我有一组类似的 div,我正在使用一些基本代码进行切换,如下所示:

 $(".field-group-format-toggler-abstract").click(function()
            {
        $(".field-group-format-wrapper").toggle();
   });

我遇到的问题是,每当我触发“+”时,当我只想切换最接近它的相关 div 时,它会切换具有相同类的所有其他 div .field-group-format-wrapper。我尝试了 .next 和 .closest 但这似乎只是锁定了一些东西然后它不起作用但我没有收到语法错误,例如

$(".field-group-format-toggler-abstract").click(function()
                {
            $(".field-group-format-wrapper").closest().toggle();
       });

我在这里创建了一个工作版本,但如果你像我上面那样添加 .closest,它就不再工作了。

http://jsfiddle.net/LHguJ/5/

** 注意,我只想显示/隐藏里面的内容,field-group-format-wrapper所以“标题”仍然需要显示是否展开。

4

4 回答 4

5

你想要的是兄弟姐妹()。并使用它来引用单击的元素。您正在使用最接近的寻找最接近的() “父母”。

$(".field-group-format-toggler-abstract").click(function() {
    $(this).siblings(".field-group-format-wrapper").toggle();
});​

http://jsfiddle.net/LHguJ/11/

于 2012-08-06T16:42:18.727 回答
1

你可以这样使用nextAll()

jsFiddle

$(".field-group-format-toggler-abstract").click(function(){
    $(this).nextAll(".field-group-format-wrapper").toggle();
});
于 2012-08-06T16:45:19.597 回答
1

尝试使用$(this).parent().find(".field-group-format-wrapper")

$(".field-group-format-toggler-abstract").click(function() {
    $(this).parent().find(".field-group-format-wrapper").toggle();
});

http://jsfiddle.net/LHguJ/12/

或与siblings

$(".field-group-format-toggler-abstract").click(function() {
    $(this).siblings(".field-group-format-wrapper").toggle();
});

​http://jsfiddle.net/LHguJ/13/

于 2012-08-06T16:50:16.923 回答
0

jQuery

$(".field-group-format-toggler-abstract").click(function(){
    $(this).siblings(".field-group-format-wrapper").toggle();
    $(this).html( $(this).html() == '+' ? '–' : '+');
});​

http://jsfiddle.net/iambriansreed/JLj2X/

于 2012-08-06T16:41:49.460 回答