Question

我有一个功能性侧面导航，可以切换显示内容。这是“过滤器”按钮......

<a href="#menu-toggle" style="background-color:black; color:white;" class="btn btn-default page-header" id="menu-toggle">
   <span style="position:relative; top:2px; right: 5px;"class="glyphicon glyphicon-resize-horizontal"></span>
                        Filter</a>

和JQuery ......

<script>
    $("#menu-toggle").click(function(e) {
        e.preventDefault();
        $("#wrapper").toggleClass("toggled");
    });
</script>

当我添加另一个用于切换相同菜单的可引发链接时，它会崩溃，但我无法理解为什么？我已将菜单切换ID更改为类，但这没有帮助。

这是不起作用的代码，即应该给出相同切换效果的第二个可点击链接......

<li class="sidebar-brand">
     <a href="#" id="menu-toggle">Collapse
     </a>
</li>

Answer 1

为正在操作的多个元素添加类而不是ID。

$(".menu-toggle").click(function(e) {
    e.preventDefault();
    $("#wrapper").toggleClass("toggled");
});

将<a id="menu-toggle"></a>更改为<a class="menu-toggle"></a>

Bootstrap菜单切换不适用于多个切换链接

1 个答案: