Jquery动画发生在多个div上

Question

所以我有一个像这样的结构

<div class="content-block">
    <div class='hidden'> Hidden Content </div>
    <div class='click'> Click Me </div>

    <div class='hidden'> Hidden Content </div>        
    <div class='click'> Click Me </div>

</div>

我希望Jquery直接为隐藏内容设置动画，以便扩展高度和宽度。我的jquery是

$(".click").click(function(){ 
    $(".click").prev(".hidden").animate({
        width:100%, 
        height: 500px
    }, 500);
});

我遇到的问题是，这会激活所有.hidden div，而不仅仅是.click之前的那个。

Answer 1

使用$(this)指定上下文：

$(".click").click(function(){
    $(this).prev(".hidden").animate({width:100%, height: 500px}, 500);
});

在您的原始代码中，您选择了所有 .click元素，因此选择了所有以前的.hidden兄弟元素。