JQuery: Accordion 样式菜单切换

Question

我正在尝试使用 div 制作一个简单的 Accordion 样式菜单:

<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");