目标最接近的类.click jQuery

Question

我想将slideToggle仅应用于最接近触发器图像的类。我不希望有多个ID来运行slideToggle的多个版本。

我尝试使用.closest，但无济于事

DEMO http://jsfiddle.net/LstNS/12/

Answer 1

应该这样做：

$('.image').click(function(){
    $(this).parents('section').find('.content').slideToggle();
});

http://jsfiddle.net/LstNS/13/

Answer 2

$('.image').click(function(){
    $(this).parent().next().slideToggle();
});

DEMO

.content不是下一项

的情况的其他选项

$('.image').click(function(){
   $(this).closest('section').find('.content').slideToggle();
});

DEMO

Answer 3

尝试：

$('.image').click(function(){
    $(this).parent().next('.content').slideToggle();
});

<强> jsFiddle example

单独

.closest()将不起作用，因为它只在DOM中查找。您需要将一个级别上升到<h3>元素，然后选择下一个元素<div class="content">。您也可以在我的示例中替换.closest('h3') .parent()。此外，在您的情况下，.next('.content')将等同于.next()。

Answer 4

.closest不是您图片的父级。试试这个：

$(this).closest('section').find('.content').slideToggle();

http://jsfiddle.net/LstNS/16/

Answer 5

这是你在找什么？

$('.image').click(function(){
    $(this).parent().siblings('.content').slideToggle();
});

我使用.parent()函数来获得与内容相同的“级别”，在这种情况下，选择了h3。接下来，我将搜索与班级内容最接近的sibling。当它找到合适的班级时，它不会进一步搜索。

<强> jsFiddle