Question

我这里有一个jsfiddle - http://jsfiddle.net/bmdpamhy/

这是三个btns，内容div在下面。按钮和内容容器具有类名。

内容div是隐藏的。

我想打开单击按钮下面的内容div。

如何只打开按钮旁边的div。

        /* This will open all content divs
        $(function(){
            $('.open').click(function(){
                $('.content').slideToggle();
            });
        })
        */


        // I want to open just the content below the button clicked
        $(function(){
            $('.open').click(function(){
                $(this).next('.content').slideToggle();
            });
        })

Answer 1

您的选择器不正确。 .content是单击按钮parent的兄弟。使用：

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

<强> Working Demo

Answer 2

以下是需要的一些修改。

http://jsfiddle.net/bmdpamhy/1/

这将使您的幻灯片内容感觉“按时显示”。看一看。

$(function(){
    $('.open').click(function(e){
        e.stopPropagation();

               $(this).parents('.wrap').find('.content.opened').slideToggle().toggleClass('opened'); 
$(this).parent().next('.content').slideToggle().toggleClass('opened');

    });
})

jQuery slideToggle具有类名的下一个容器

2 个答案: