0

我有以下 HTML：

<nav class="menu" role="navigation">
  <ul>
    <li><a href="#">Home</a></li>
    <li>
      <a href="#">Content</a>
      <ul>
        <li><a href="#">Files</a></li>
        <li><a href="#">Posts</a></li>
      </ul>
    </li>  
    <li><a href="#">Site</a></li>             
  </ul>
</nav>

使用以下 CSS 样式：

nav ul ul {display: none;} // Hides the child menus

以及以下 JQuery 代码：

$('nav.menu a[href="#"]').click(function () {
  $(this).next('ul').toggle();
});

哪个应该切换子菜单的可见性。

但是，当我单击“内容”A 标签时，下一个 UL 不会显示。

有谁知道如何解决这个问题？

4

2 回答 2

1

这项工作对我来说很好：

$(document).ready(function(){    
    $('nav.menu a[href="#"]').click(function () {
        $(this).next('ul').toggle();
    });
});

它正确切换旁边的 ul 菜单<a href="#">Content</a>

于 2013-08-29T14:11:02.173 回答
0

我发现了问题......我在我最初的问题中发布了：

nav ul ul {display: none;}

但实际上我有以下内容：

nav ul ul {display: none !important;}

我正在使用“隐藏” LESS mixin 并没有意识到它......

但是，使用重要的阻止 Jquery Toggle 工作不是很奇怪吗？

于 2013-08-29T14:14:12.623 回答