1

我正在为某人制作一个响应式主题。我已经制作了菜单，但我使用 jQuery .slide() 来打开菜单幻灯片。问题是，当我切换到滑动打开菜单时，它也会滑动打开其中的所有子菜单。

我可以添加选择器来解决这个问题。但是，通过添加选择器，这意味着如果用户应该添加更多子菜单，他/她可能必须更改 jQuery。所以我试图保留它，以便用户永远不必触摸 jQuery。

这个问题有什么解决办法吗？

HTML：

<div id="LinkList1">
    <div class="menu-toggle">Menu</div>
    <ul class="firstlevel">
        <li>First Link</li>
        <li class="share-toggle">First Link
            <ul class="secondlevel">
                <li>First Drop Link</li>
                <li>Second Drop Link</li>
            </ul>
        </li>
    </ul>
</div>

CSS：

ul { display: none; }

jQuery :

$(".menu-toggle").click(function () {
    $("#LinkList1 ul").slideToggle("fast");
});
$(".share-toggle").click(function () {
    $("#LinkList1 ul ul").slideToggle("fast");
});

小提琴：http: //jsfiddle.net/tXQzM/

4

1 回答 1

2

试试这个

$(".menu-toggle").click(function (e) {
    $(this).next('ul').slideToggle("fast");
});
$(".share-toggle").click(function (e) {
    $(this).find('ul').slideToggle("fast");
});

检查小提琴

ul无论后代的深度如何，您似乎都在选择所有的东西。

因此，您将使用this包含当前选定元素的上下文，该元素生成事件并在其中显示相应的元素ul。

于 2013-06-23T03:06:46.897 回答