jquery - 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兄弟元素。