使用切換點擊和元素並顯示/隱藏它下面的元素？

Question

我有以下結構：

我要讓ul.children節目，並通過單擊另一個像上面（酒吧）隱藏。

它應該只顯示/隱藏下面的一個，因爲頁面充滿了具有相同結構的無序列表。

所以我堅持在這裏：

$('#wpbdp-categories > .wpbdp-categories > li.cat-item > a').click(function() { 
    ??? 
}); 

有什麼建議？

Answer 1

$('#wpbdp-categories > .wpbdp-categories > li.cat-item > a').click(function() { 
    $(this).siblings("ul.children").toggle(); 
}); 

應該工作，我認爲

Answer 2

嘗試使用.next()

例如

$(this).next('.children').toggle(); 

Answer 3

$('#wpbdp-categories > .wpbdp-categories > li.cat-item > a').toggle(
    function() { $(this).next().show() }, 
    function() { $(this).next().hide() } 
); 

最簡單的方法..

編輯：

.toggle()處理click事件，這樣你們不需要定義一個click事件吧。

http://api.jquery.com/toggle-event/

的.toggle（）方法結合的Click事件處理程序，所以規則 概述了點擊的觸發同樣在此適用。