Question

我已经尝试了几个月来找到连接我的菜单，但令人沮丧的是我没有运气。我不知道我还能尝试什么，所以我想问问你们，如果你能提供帮助的话。我在这里搜索了一下这个想法，这在某种程度上描述了我想要的功能但是我想利用数据属性方式而不是href而我想使用on click函数而不是hover，因为它是桌面和移动。我还想用桌面版的菜单关闭子菜单，切换是一个选项吗？链接：jquery dropdown with separate container

HTML

<div class="menu">
    <ul>
        <li><a href="javascript:void(0);" data-section="one">item1</a></li>
        <li><a href="javascript:void(0);" data-section="two">item2</a></li>
        <li><a href="javascript:void(0);" data-section="three">item3</a></li>
    </ul>
</div>
<div class="submenu">
    <ul>
        <li class="one">content1</li>
        <li class="two">content2</li>
        <li class="three">content3</li>
    </ul>
</div>

子菜单中的

内容设置为高度：0，我想在触发时设置为自动，或者可以在子菜单中添加一个类：

.submenu ul li{
    display:block;
    overflow:hidden;
    height:0;
.submenu ul li.active{
    height:auto;
}

JS Fiddle

Answer 1

我不确定这是否是您想要的，但请尝试替换

$(this).attr('data-section').slice(1)

用这个

$(this).attr('data-section')

jsfiddle（基于你的）

Answer 2

只需删除.slice（1）即可。我不知道你为什么要添加这个。

当您点击菜单链接时，jquery将从列表中删除活动类，它将添加到与数据部分菜单链接相关的新链接。

菜单有单独的div部分

2 个答案: