0

私はサイドバーナビゲーション（ブートストラップを使用）に取り組んでいました。しかし、ここで行き詰まりました。子メニューを切り替えることができません。メイン、次のセクション、第 3 セクションなどのトップ メニューをクリックしたときに子メニューを非表示にする必要があるだけです。たとえば、メイン メニューをクリックすると、すべての子ダッシュボードを非表示にし、[次のセクション] メニューをクリックしてすべてのサンプル セクションを非表示にする必要があります。

非常に価値のある任意のヘルプ

これが構造です

<ul class="nav nav-tabs nav-stacked main-menu">
        <li class="nav-header">Main</li>
        <li><a href='#'>Dashboard</a></li>
        <li><a href='#'>Dashboard</a></li>
        <li><a href='#'>Dashboard</a></li>
        <li><a href='#'>Dashboard</a></li>
        <li class="nav-header">Next Section</li>
        <li><a href='#'>Sample Section</a></li>
        <li><a href='#'>Sample Section</a></li>
        <li><a href='#'>Sample Section</a></li>
        <li><a href='#'>Sample Section</a></li>
        <li class="nav-header">Third Section</li>
        <li><a href='#'>Third Sample Section</a></li>
        <li><a href='#'>Third Sample Section</a></li>
        <li><a href='#'>Third Sample Section</a></li>
        <li><a href='#'>Third Sample Section</a></li>
    </ul>
4

2 に答える 2

3

このようにjQueryを使用できます.nextUntil()..

$('.nav-header').click(function () {
    $(this).nextUntil('.nav-header').toggle(200);
});

デモ: http://bootply.com/67126

于 2013-07-11T13:42:26.480 に答える