Question

您已经使用bootstrap javascript插件创建了一个可折叠的手风琴菜单，该菜单效果很好，但我想知道是否可以使用jquery活动类在加载新页面时将菜单保持在当前位置从菜单中。我只是在学习javascript，因此我不确定如何做到这一点。

这是我的菜单的一些HTML：

     <div id="nav">                     
         <div id="accordion">           
             <div class="heading">  
             <a class="accordion-toggle nav-main-item" data-toggle="collapse" data-parent="#accordion" href="#collapseOne">About</a>
             </div><!--ends heading--> 
             <div id="collapseOne" class="collapse">
                 <ul>
                 <li><a class="nav-sub-item" href="about.html">me</a></li>
                 <li><a class="nav-sub-item" href="articles.html">articles</a></li>
            </ul>
             </div><!--ends collapseOne-->
         </div>
     </div>

单击“关于”时，“我”和“文章”会打开，这两个链接到新页面。我希望菜单在点击这些链接时保持打开状态。

Answer 1

在in上添加collapseOne课程会使手风琴默认开启。

<div id="nav">
    <div id="accordion">
        <div class="heading"> <a id="about" class="accordion-toggle nav-main-item" data-toggle="collapse" data-parent="#accordion" href="#collapseOne">About</a>

        </div>
        <!--ends heading-->
        <div id="collapseOne" class="collapse">
            <ul>
                <li><a class="nav-sub-item" href="about.html">me</a>

                </li>
                <li><a class="nav-sub-item" href="articles.html">articles</a>

                </li>
            </ul>
        </div>
        <!--ends collapseOne-->
    </div>
</div>

<script>
    $(function() {
       $('#collapseOne').addClass('in'); 
    });
</script>

JSFiddle中的示例

http://jsfiddle.net/zw3ZU/

bootstrap collapse，jquery active

1 个答案: