Question

我有以下HTML結構：

（玉模板語言）

#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。