JQuery的：手風琴風格的菜單切換

Question

我想使用的div作一個簡單的手風琴式菜單：

<div class="subdomainLevel"> 
    Subdomain <a href="#" class="pageToggle">open/close</a> 

    <div class="pageLevel">Page Level <a href="#" class="messageToggle">open/close</a> 
     <div class="pageMessage">Message</div> 
    </div> 

</div> 

<div class="subdomainLevel"> 
    Subdomain <a href="#" class="pageToggle">open/close</a> 

    <div class="pageLevel">Page Level <a href="#" class="messageToggle">open/close</a> 
     <div class="pageMessage">Message</div> 
    </div> 

</div> 

我jQuery是如下：

var page = $(".subdomainLevel").children(".pageLevel"); 
$(".pageToggle").click(function() { 
    $(page).slideToggle("fast"); 
}); 

我怎樣才能讓我的可重複使用的JQuery所以當我點擊我的「打開/關閉」鏈接時，鏈接只控制該div的子節點，而不是具有相同類的頁面上的其他div節點。

謝謝，

Answer 1

代替：

$(page).slideToggle("fast"); 

使用：

$(this).siblings('.pageLevel').slideToggle("fast"); 

例如在：

http://jsfiddle.net/2CEmx/

編輯： 所以你並不真的需要這條線都：

var page = $(".subdomainLevel").children(".pageLevel"); 

Answer 2

試試這個：

$(this).next(".pageLevel").slideToggle("fast");