Question

嗨，我想知道是否有人可以提供帮助。我正在使用Bootstrap 3.1.1并使用嵌套折叠菜单进行sidenav。我想在打开的菜单中添加背景颜色（使用类）并删除菜单上的背景颜色。

这工作正常，但是当我有嵌套菜单时，我正在使用的代码在关闭子菜单时删除父项的背景颜色，我无法弄清楚如何只删除背景颜色顶级菜单关闭。因此，如果是子菜单，关闭子菜单时不应删除背景颜色。

$(".nav-sidenav > li").on("show.bs.collapse", function () {
    $(this).addClass("sidenav-active-background");
});
$(".nav-sidenav > li").on("hide.bs.collapse", function () {
    $(this).removeClass("sidenav-active-background");
});

请参阅JSFiddle

Answer 1

首先，您需要删除＆＃39;＆gt;＆＃39;隐藏。这将使其涵盖导航中的所有列表项。然后你需要添加＆＃39; e＆＃39;到回调函数。最后添加e.stopPropagation（）保持父元素不在事件中触发并删除类。

来自

 $(".nav-sidenav > li").on("hide.bs.collapse", function () {
  $(this).removeClass("sidenav-active-background");
 });

要

$(".nav-sidenav li").on("hide.bs.collapse", function (e) {
  e.stopPropagation();
  $(this).removeClass("sidenav-active-background");
});

http://jsfiddle.net/clurect/TF2Tg/1/

一些提示：我使用hidden.bs.collapse进行视觉美学。您还可以进行检查以确保触发事件的列表项。

嵌套引导程序3.1.1崩溃

1 个答案: