效果图如下：

ps： 由于layui admin后台管理系统框架没有实现此功能，所以自己动手做了一个。

关键代码如下：

index.html

$("body").delegate(".layui-tab-title li","click",function() {
            //或者$(this).childNodes[0].data
            console.log($(this).context.childNodes[0].data);
            var Len = $("#nav li a cite").length;
            var Index;
            for(var i = 0; i < Len; i++) {
                if($(this).context.childNodes[0].data == $("#nav li a cite").eq(i).text()) {
                    Index = i;
                }
                // console.log($("#nav li a cite").eq(i).text());
            }
            console.log(Index);
            console.log($("#nav li a cite").eq(Index).parentsUntil("#nav"));
            // 左侧菜单初始化
            $('.left-nav').find('a').removeClass('active');
            $("#nav li a cite").eq(Index).parentsUntil("#nav").eq(3).siblings().children('.sub-menu').stop(true,true).slideUp();
            $("#nav li a cite").eq(Index).parentsUntil("#nav").eq(3).siblings().find('.nav_right').html('&#xe697;');
            $("#nav li a cite").eq(Index).parentsUntil("#nav").eq(3).removeClass("open");

            $("#nav li a cite").eq(Index).parentsUntil("#nav").eq(0).addClass("active");
            $("#nav li a cite").eq(Index).parentsUntil("#nav").eq(3).addClass("open");
            $("#nav li a cite").eq(Index).parentsUntil("#nav").eq(3).find('.nav_right').html('&#xe6a6;');
            $("#nav li a cite").eq(Index).parentsUntil("#nav").eq(2).stop(true,true).slideDown();
        });
    

到此，就大功告成了，快去试试吧。

优质内容筛选与推荐>>
1、[Big Data - Codis, Mycat（cobar）] 企业互联网+转型实战：如何进行PB级别数据的架构变迁
2、冒泡排序，选择排序，插入排序，归并排序
3、Step by Step 开发dynamics CRM
4、胡润研究院发布《2018胡润区块链富豪榜》
5、Jerry Mouse

赞赏

长按二维码向我转账

受苹果公司新规定影响，微信 iOS 版的赞赏功能被关闭，可通过二维码转账支持公众号。

阅读

已发送

发送中