php - 使用jQuery自定义 Accordion

我正在尝试使用jquery创建一个自定义手风琴，已经阅读了很多关于stackoverflow的解决方案，但是我似乎无法正常工作，我相信它必须处理.siblings。无论如何，这是我的html代码：

<div class="menu">
    <ul>
        <li class="current">
            <a href="#" class="current"><img class="icon" src=""/>Dashboard</a>
        </li>
        <li>
            <a href="#"><img class="icon" src=""/>Mail</a>
            <ul class="submenu">
                <li>
                    <a href="#" title="">Write New</a>
                </li>
                <li>
                    <a href="#" title="">Junk</a>
                </li>
                <li>
                    <a href="#" title="">Deleted</a>
                </li>
            </ul>
        </li>
        <li>
            <a href="#"><img class="icon" src=""assets/colors.png""/>Child</a>
            <ul class="submenu">
                <li>
                    <a href="#">Child 1</a>
                </li>
                <li>
                    <a href="#">Child 2</a>
                </li>
                <li>
                    <a href="#">Child 3</a>
                </li>
            </ul>
        </li>
        <li>
            <a href="#"><img class="icon" src=""/>Grid</a>
        </li>
        <li>
            <a href="#"><img class="icon" src=""/>Class</a>
        </li>
    </ul>
</div>

这是我的jQuery代码：

$('.menu ul li a').click(function() {

    $(this).next('.submenu').siblings('li').slideUp();
    $(this).next('.submenu').slideToggle();

});

菜单切换为打开正常，但是当我打开一个菜单时，其他菜单则不会关闭。

谢谢你的帮助 ！！

最佳答案

它不会关闭的原因是因为兄弟姐妹的视线相同。因此，在LI元素内它将查找更多的LI元素。您不需要来自父级的同级LI，并在那里关闭子级.submenu。

尝试这个：

$(this).parent().siblings('li').find('.submenu').slideUp();