jquery選擇最接近的div

Question

類別div是隱藏的，我希望它在被展開時被顯示。任何幫助，將不勝感激。

HTML

<div class="categorization"> 
<a href="#" class="toggler">something</a> 

<div class="categories"> 
</div> 

</div> 

我想這一點。

jQuery的

$(".categorization .toggler").hover(function() { 
    $(this).closest('.categories').show(); 
    }, function(){ 
    $(this).closest('.categories').hide(); 
    }); 

Answer 1

closest()走祖先的樹，所以它不是你要找的。您可以使用nextAll()和first()達到你想要的東西：

$(".categorization .toggler").hover(function() { 
    $(this).nextAll(".categories").first().show(); 
}, function(){ 
    $(this).nextAll(".categories").first().hide(); 
}); 

注意next()只有第二天元素相匹配，所以next(".categories")將僅在<div>元素緊跟您的toggler元素的工作。

Answer 2

需要注意的是：

在jQuery的API，

.closest（）：獲取選擇相匹配，在當前元素開始，前進了第一個祖先元素通過DOM樹。

顯然，你< div>元素不是<）的祖先元素的>

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

在這種情況下，你應該嘗試。接下來（如果你想獲得只有一個元素， 或.nextAll（），如果你想獲得所有元素匹配你的選擇器。

Answer 3

var categoryDiv = $(this).next('div'); // or 
var categoryDiv = $(this).next('.categories'); 

這會讓你的下一個兄弟姐妹相對於觸發器。