Layui二级菜单优化

Layui二级菜单优化刚开始学习layui框架,碰到一个缺陷是二级菜单每次点击都会收缩到原始状态。用 Request.Url.ToString();获取URL判断点击页面前哪些节点是展开的,添加class=\"layui-nav-itemlayui-nav-itemed\">(展开子节点)解决了。代码如下:for(vari=0;i<data.length;i++){…

大家好,又见面了,我是你们的朋友全栈君。

刚开始学习layui框架,碰到一个缺陷是二级菜单每次点击都会收缩到原始状态。用 Request.Url.ToString();获取URL判断点击页面前哪些节点是展开的,添加class=\”layui-nav-item layui-nav-itemed\”>(展开子节点)解决了。代码如下:

       for (var i = 0; i < data.length; i++) {
                            //添加头栏目
                            if (data[i].children.length > 0) {
                                var curFocus = null;
                                var curUrl = '@Request.Url.ToString()';
                                var hasFocusParent = null;
                                var clickTree = null;
                                for (var j = 0; j < data[i].children.length; j++) {
                                    if (curUrl.lastIndexOf(data[i].children[j].href) > 0) {
                                        clickTree = data[i].children[j].id;
                                        hasFocusParent = data[i].id;
                                    }
                                };
                                if (hasFocusParent == data[i].id) {
                                    item += "<li class=\"layui-nav-item layui-nav-itemed\">  <a href=\"javascript:;\">" + data[i].name + "</a><dl class=\"layui-nav-child\">";
                                    //class=\"layui-nav-item layui-nav-itemed\">展开子节点
                                }
                                else {
                                    item += "<li class=\"layui-nav-item\"><a href=\"javascript:;\">" + data[i].name + "</a><dl class=\"layui-nav-child\">";
                                }
                                for (var j = 0; j < data[i].children.length; j++) {
                                    if (data[i].children[j].id == clickTree) {

                                        item += "<dd style=\"background-color: #009688\"><a href=\"" + data[i].children[j].href + "\">" + data[i].children[j].name + "</a></dd>";

                                    } else {
                                        item += "<dd><a href=\"" + data[i].children[j].href + "\">" + data[i].children[j].name + "</a></dd>";
                                    }
                                };
                                item += "</dl></li>";
                            } else {
                                item += "<li class=\"layui-nav-item\"><a href=\"" + data[i].href + "\">" + data[i].name + "</a></li>";
                            }
                        };

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请联系我们举报,一经查实,本站将立刻删除。

发布者:全栈程序员-站长,转载请注明出处:https://javaforall.net/146209.html原文链接:https://javaforall.net

(0)
上一篇 2022年5月15日 下午5:40
下一篇 2022年5月15日 下午5:40


相关推荐

  • murmurhash算法_MurmurHash与随机数

    murmurhash算法_MurmurHash与随机数unsignedintmurMurHash(constvoid*key,intlen){constunsignedintm=0x5bd1e995;constintr=24;constintseed=97;unsignedinth=seed^len;//Mix4bytesatatimeintothehashconstunsigne…

    2022年10月18日
    5
  • 从日记到博客

    从日记到博客我自零八年上大学开始主动写日记,记录一些自己的想法。我特别喜欢在纸上写字的感觉。我会在纸上记录一些想法和反思,自己新见识的事物、经历,与人接触的小摩擦,待人接物的新想法,也有自己的情感的。当看看最初的日记的时候,觉得当时的想法还非常的幼稚。后来经历的一些事情给我很多困惑、苦恼、启发、激励,帮我建立对人、对事的态度和认知。如果不是这些文字,过去的我是什么样子,会有什么样的想法,早就完全忘记了。正是这…

    2022年5月18日
    36
  • Ubuntu的8080端口被占用

    Ubuntu的8080端口被占用因为最近学习 web 建站技术 弄了好多环境 今天开机启动服务的时候报了如下错误 意思就是我的 8080 端口已经被别的进程占用了 导致服务启动异常 解决办法 soeasy 找到占用 8080 端口的进程 直接 kill 掉就好啦 百度一下 第一步使用 netstat ntl grep8080 查看 8080 端口的占用情况 再使用命令 lsof i 8080 就可以列出占用 80

    2026年3月19日
    1
  • strictmode android,Android StrictMode使用「建议收藏」

    strictmode android,Android StrictMode使用「建议收藏」StrictMode是Android提供的一个开发工具,用于检测一些异常的操作,以便开发者进行修复。StrictMode可以监控以下问题,不应该在应用主线程中完成的工作,包括磁盘读写、网络访问等。内存泄露,包括Activity泄露、SQLite泄露、未正确释放的对象等。使能StrictMode通常在Application和Activity的开始处(如onCreate)添加代码使能StrictMod…

    2022年5月2日
    102
  • BZOJ2803[Poi2012]Prefixuffix——hash

    BZOJ2803[Poi2012]Prefixuffix——hash

    2021年6月12日
    110
  • pixi 小游戏_pixi2d小游戏跳一跳源码/pixi教程,基于pixi-spine的2d游戏

    pixi 小游戏_pixi2d小游戏跳一跳源码/pixi教程,基于pixi-spine的2d游戏jump gammer 这很简单 先这样再这样 哈哈哈 做的时候就各种红了 这个项目是我上一年参加虎牙小程序比赛 留下的 不知道现在虎牙小程序凉凉了没 那时候遇到了各种部署上去的问题 通宵了两晚修改 pixi 和 pixi spine 的源码 遗憾的是错过了比赛提交的时间节点 所以这就是 那个 stone 人物踩在上方的 落脚物 为什么是 HuyaLogo 的原因 所以把这个项目拉出来

    2026年3月17日
    2

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注

关注全栈程序员社区公众号