javascript - 单击其自己的切换按钮后仅切换当前 div？

Question

我有以下 HTML 结构:

( Jade 模板语言)

#review-item-1.review-item
      a.submit-review-toggle(href="#").review-item-toggle +
      h3 Service
      .review-overview
        textarea(class='submit-review-overview', name='message', placeholder='Overview')
      .review-photo
        img(src="images/no-photo.png")

我希望能够展开和折叠 .review-item div 的高度(在顶部):

$(".submit-review-toggle").click(function() {
    $(".review-item").animate({
        height: "toggle",
    }, "slow");
});

问题是我将在单个页面中有很多 .review-item div。因此，我需要在您单击其自己的 .submit-review-toggle 按钮后切换“当前”.review-item div。

关于如何实现这一点有什么建议吗？

Answer 1

尝试以下操作:

$(".submit-review-toggle").click(function() {
   $(this).closest(".review-item").animate({
       height: "toggle",
   }, "slow");

});

最近的选择器获取与选择器匹配的第一个元素，从当前元素开始并向上遍历 DOM 树。 See here for documentation .