toggle類的.closest（）

Question

$(".toggle-more-less").click(function() { 
     $(this).closest(".article").toggleClass("show-hide");   
    }); 

我想切換智能手機大小站點的文章長度以節省空間。

我認爲這會工作 - 但我不明白.closest（）我猜。

HERE是一個jsfiddle。

任何方向都是GRRRRREAT！

Answer 1

$（本）意味着啓動該功能的項目，所以在這種情況下'$（「。toggle-more-less」）'。 最近會尋找符合設定條件的最接近的父（$），所以在這種情況下，它會向上遍歷dom，直到它達到一個'figure'。

$(this).closest('figure').find("figcaption").toggleClass("show"); 

小提琴：http://jsfiddle.net/6whzQ/

Answer 2

一個快速的解決辦法是這樣的：$(this).parent().find("figcaption").toggleClass("show");

Answer 3

http://jsfiddle.net/q7kjr/3/

$(this).prev().toggleClass("show"); 
$(this).prev("figcaption").toggleClass("show"); 
$(this).closest('figure').find("figcaption").toggleClass("show"); 

文檔：

http://api.jquery.com/prev/

http://api.jquery.com/closest/