chrome 网页 左侧导航栏不展开

Posted 2021-01-25

chrome 网页 左侧导航栏不展开

现象

代码

 <li    class="one">
                        <a href="#"><i class="fa fa-sitemap"></i> <span class="nav-label">菜单 </span><span class="fa arrow"></span></a>
                        <ul class="nav nav-second-level collapse">
                            <li  class="second">
                                <a href="#" id="damian">二级菜单1 <span class="fa arrow"></span></a>
                                <ul class="nav nav-third-level">
                                    <li class="third">
                                        <a href="#">三级菜单1</a>
                                    </li>
                                    <li>
                                        <a href="#">三级菜单2</a>
                                    </li>
                                    <li>
                                        <a href="#">三级菜单3</a>
                                    </li>

                                </ul>
                            </li>
                            <li><a href="#">二级菜单2</a></li>
                            <li>
                                <a href="#">二级菜单3</a></li>
                            <li>
                                <a href="#">二级菜单4</a></li>
                        </ul>
                    </li>

js

            window.onload = function () {
                $(".one").addClass("active");
                $(".second").addClass("active");
                $(".third").addClass("active");

            };  

测试

其中 360 ，火狐浏览器可正常展开，在chrome中无法展开。

F12 查看 源码

<ul class="nav nav-third-level collapse ">
</ul>

发现  collapse 没有变成in，再具体原因暂时未查找到

解决办法

手动添加in

         window.onload = function () {
                $(".one").addClass("active");
                $(".one").children(‘ul‘).addClass(‘in‘);
                $(".second").addClass("active");
                $(".second").children(‘ul‘).addClass(‘in‘);
                $(".third").addClass("active");
         };