文档章节

为jeesite框架左侧菜单添加未读条数

旺仔没馒头
 旺仔没馒头
发布于 2017/09/09 19:49
字数 385
阅读 29
收藏 0

        在做项目时,有一个功能是在左侧菜单上添加一个未读条数,由于项目用到是jeesite框架,其页面內容的显示是在iframe中,因此,大致的实现思路是,在iframe页面中,找到父级元素中对应的菜单,为其添加一个未读条数就行。

以下是添加未读条数的主要js,因为项目要兼容到ie8,因此对ie9以下的浏览器做了兼容处理

var leftMenuNum = {
    addNum: function (num, numColor) {
        var color = numColor == undefined ? "#ff0000" : numColor;
        var count = num == undefined ? 0 : num;
        var endNumReg = null;
        if (this.isLessIE9()) {
            endNumReg = new RegExp("\<FONT color=(.*)>[0-9]+</FONT>");
        } else {
            endNumReg = new RegExp("\<font color=(.*)>[0-9]+</font>");
        }
        var content = "<font color=\"" + color + "\">" + count + "</font>";
        var appendContent = "[" + content + "]";
        var $jerichotab = $("#jerichotab", window.parent.document);
        var $topTab = $jerichotab.children("div[class='tab_pages']").children("div[class='tabs']").find("li[class='jericho_tabs tab_selected']");
        var topTabId = $topTab.attr("id");
        var menuTabIndex = null;
        var $leftMenu = null;
        var $menu = $("li[class='active']", window.parent.document);
        if (topTabId == null || topTabId == undefined || topTabId == '') {
            $leftMenu = $menu.children('a');
        } else {
            menuTabIndex = topTabId.substring(topTabId.indexOf('_') + 1, topTabId.length + 1);
            $leftMenu = $menu.children('a[jerichotabindex=' + menuTabIndex + ']');
        }
        var menuContent = $leftMenu.html();
        if (!endNumReg.test(menuContent)) {
            $leftMenu.html('');
            $leftMenu.html(menuContent + appendContent);
        } else {
            var newContent = menuContent.replace(endNumReg, content);
            $leftMenu.html(newContent);
        }
    },
    isLessIE9: function () {
        var browser = navigator.appName
        var b_version = navigator.appVersion
        var version = b_version.split(";");
        var trim_Version = version[1].replace(/[ ]/g, "");
        if (browser == "Microsoft Internet Explorer" && trim_Version == "MSIE6.0") {
            return true;
        }
        else if (browser == "Microsoft Internet Explorer" && trim_Version == "MSIE7.0") {
            return true;
        }
        else if (browser == "Microsoft Internet Explorer" && trim_Version == "MSIE8.0") {
            return true;
        }
        else if (browser == "Microsoft Internet Explorer" && trim_Version == "MSIE9.0") {
            return false;
        }
        return false;
    }
}

        在想要添加左侧未读条数的页面,添加如下代码,第一个参数为显示的条数,第二个参数是数字的颜色,默认的条数为0,颜色为红色

leftMenuNum.addNum(10,"#000");

以下便是页面效果:

© 著作权归作者所有

共有 人打赏支持
旺仔没馒头
粉丝 3
博文 18
码字总数 13798
作品 0
济南
程序员
私信 提问
JeeSite是否支持MongoDB?

因项目组长决定使用JeeSite ,而我对这个不太熟悉,网上资料也较少,冒昧求问: http://www.oschina.net/p/jeesite 这边对JeeSite中数据库的说明是: 数据库支持:目前仅提供MySql、Oracle数...

syj52417
2015/09/08
390
1
ThinkGem/JeeSite4 Spring Cloud

引言 JeeSite Spring Cloud 是基于 Spring Cloud Finchley 的一个分布式系统套件的整合。 特点:用经典开发模式,开发分布式应用,两个字【简单】,一个字【快】。 技术选型 分布式系统主框架...

ThinkGem
12/07
0
0
分布式系统套件的整合 - JeeSite Spring Cloud

引言 JeeSite Spring Cloud 是基于 Spring Cloud Finchley 的一个分布式系统套件的整合。 特点:用经典开发模式,开发分布式应用,两个字【简单】,一个字【快】。 技术选型 分布式系统主框架...

ThinkGem
11/19
0
0
JeeSite环境搭建及运行和打包(master20161117)

涉及的软件: 1、phpStudy(主要用MySql) 2、maven3(用于依赖包,下面我将上传已经下载好所有依赖包的版本,保证运行正常) 具体操作: 0、前言 由于GitHub上的Release版本没有及时更新,所...

easonjim
2016/11/18
0
0
JeeSite 4.0.0 开发平台社区测试版公布,欢迎大家测试反馈意见

JeeSite 是一个 Java EE 企业级快速开发平台,基于经典技术组合(Spring Boot、Spring MVC、Apache Shiro、MyBatis、Beetl、Bootstrap、AdminLTE),在线代码生成功能,包括核心模块如:组织...

ThinkGem
02/25
11.4K
32

没有更多内容

加载失败,请刷新页面

加载更多

oh-my-zsh 自定义

GitHub 地址 基于 oh-my-zsh 的自定义配置,增加了一些个人常用插件与皮肤。 采用的是 git submodule 来维护,包括 oh-my-zsh,之所以这么搞,主要是手头有多台 linux 需要维护, 每台机器、...

郁也风
今天
5
0
Docker安装踩坑:E_FAIL 0x80004005的解决

参考 菜鸟教程--Windows Docker 安装 http://www.runoob.com/docker/windows-docker-install.html 官方文档-Install Docker Toolbox on Windows https://docs.docker.com/toolbox/toolbox_in......

karma123
今天
5
0
js垃圾回收机制和引起内存泄漏的操作

JS的垃圾回收机制了解吗? Js具有自动垃圾回收机制。垃圾收集器会按照固定的时间间隔周期性的执行。 JS中最常见的垃圾回收方式是标记清除。 工作原理:是当变量进入环境时,将这个变量标记为“...

Jack088
昨天
17
0
大数据教程(10.1)倒排索引建立

前面博主介绍了sql中join功能的大数据实现,本节将继续为小伙伴们分享倒排索引的建立。 一、需求 在很多项目中,我们需要对我们的文档建立索引(如:论坛帖子);我们需要记录某个词在各个文...

em_aaron
昨天
27
0
"errcode": 41001, "errmsg": "access_token missing hint: [w.ILza05728877!]"

Postman获取微信小程序码的时候报错, errcode: 41001, errmsg: access_token missing hint 查看小程序开发api指南,原来access_token是直接当作parameter的(写在url之后),scene参数一定要...

两广总督bogang
昨天
33
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部