jQuery仅切换最接近它的相关div [英] JQuery toggle only related div closest to it

问题描述

我有一些类似的div，可以使用以下基本代码进行切换:

I have sets of similar divs that I am toggleing with some basic code like this:

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

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

The issue I am having is that whenever I trigger the "+", it toggles all other divs with the same class when I only want to toggle the related div closest to it .field-group-format-wrapper . I tried .next and .closest but that just seems to lock things up and then it does not work yet I am getting no syntax error e.g.

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

我在这里创建了一个工作版本，但是如果您像上面一样添加.closest，它将无法正常工作.

I created a working version here but if you add in .closest as I have above, it does not work anymore.

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

**注意，我只想显示/隐藏field-group-format-wrapper中的内容，因此仅显示或隐藏是否已展开.

** Note, I only want to show / hide what's in field-group-format-wrapper and nothing else so the "Title" still needs to show whether expanded or not.

推荐答案

您想要的是 siblings().并使用它来引用被单击的元素.您使用的是最接近的字词，它查找 closest()父"字词.

What you want is siblings(). And use this to refer to the clicked element. You were using closest which looks for the closest() 'parent'.

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

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

这篇关于jQuery仅切换最接近它的相关div的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！