博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
easyui换主题,并记录在cookie
阅读量:6545 次
发布时间:2019-06-24

本文共 2691 字,大约阅读时间需要 8 分钟。

hot3.png

easyui换皮肤自己实现了,但是下次打开浏览器的时候,上次选中的皮肤又变回默认皮肤了,怎样让浏览器记住自己所选的皮肤。这里我给出我的解决方案。

注:引入JS的顺序jquery>cookie>easyuicss>changeEasyUITheme.js

首先将easyui的样式文件加入一个ID,这里命名为easyuiTheme,然后在样式文件下面加入一个JS文件

<script type="text/javascript" charset="UTF-8" src="jslib/jquery-easyui-1.2.5/jquery-1.7.1.min.js"></script> 
<script type="text/javascript" charset="UTF-8" src="jslib/jquery.cookie.js"></script>
<link id="easyuiTheme" rel="stylesheet" type="text/css" href="jslib/jquery-easyui-1.2.5/themes/gray/easyui.css">
<script type="text/javascript" charset="UTF-8" src="jslib/changeEasyuiTheme.js"></script>
<link rel="stylesheet" type="text/css" href="jslib/jquery-easyui-1.2.5/themes/icon.css">
<script type="text/javascript" charset="UTF-8" src="jslib/jquery-easyui-1.2.5/jquery.easyui.min.js"></script>
<script type="text/javascript" charset="UTF-8" src="jslib/jquery-easyui-1.2.5/locale/easyui-lang-zh_CN.js"></script>

changeEasyuiTheme.js文件的内容是

function changeThemeFun(themeName) {/* 更换主题 */

var $easyuiTheme = $('#easyuiTheme');

var url = $easyuiTheme.attr('href');

var href = url.substring(0, url.indexOf('themes')) + 'themes/' + themeName + '/easyui.css';

$easyuiTheme.attr('href', href);

var $iframe = $('iframe');

if ($iframe.length > 0) {

for ( var i = 0; i < $iframe.length; i++) {

var ifr = $iframe[i];

$(ifr).contents().find('#easyuiTheme').attr('href', href);

}

}

$.cookie('easyuiThemeName', themeName, {

expires : 7

});

};

if ($.cookie('easyuiThemeName')) {

changeThemeFun($.cookie('easyuiThemeName'));

}

jquery.cookie.js的内容是

jQuery.cookie = function (key, value, options) {

    // key and value given, set cookie...

    if (arguments.length > 1 && (value === null || typeof value !== "object")) {

        options = jQuery.extend({}, options);

        if (value === null) {

            options.expires = -1;

        }

        if (typeof options.expires === 'number') {

            var days = options.expires, t = options.expires = new Date();

            t.setDate(t.getDate() + days);

        }

        return (document.cookie = [

            encodeURIComponent(key), '=',

            options.raw ? String(value) : encodeURIComponent(String(value)),

            options.expires ? '; expires=' + options.expires.toUTCString() : '', // use expires attribute, max-age is not supported by IE

            options.path ? '; path=' + options.path : '',

            options.domain ? '; domain=' + options.domain : '',

            options.secure ? '; secure' : ''

        ].join(''));

    }

    // key and possibly options given, get cookie...

    options = value || {};

    var result, decode = options.raw ? function (s) { return s; } : decodeURIComponent;

    return (result = new RegExp('(?:^|; )' + encodeURIComponent(key) + '=([^;]*)').exec(document.cookie)) ? decode(result[1]) : null;

};

使用的时候

changeThemeFun('default');

changeThemeFun('gray');

转载于:https://my.oschina.net/u/1464512/blog/603409

你可能感兴趣的文章
BFS
查看>>
阿里架构师浅析体面编码之代码注释评论
查看>>
Java springcloud B2B2C o2o多用户商城 springcloud架构(四)SpringBoot 整合JPA
查看>>
教你如何自学UI设计
查看>>
单颗GPU计算能力太多、太贵?阿里云发布云上首个轻量级GPU实例
查看>>
Python数据库MongoDB骚操作
查看>>
Unity(创建脚本)
查看>>
Network组件
查看>>
FastDFS安装、配置、部署(一)
查看>>
记一次CentOS6.4 安装SVN
查看>>
我的友情链接
查看>>
我的友情链接
查看>>
redhat centos apache 403 错误 Forbidden You don't have permission to access / on this server
查看>>
5.PowerShell -- 数组和哈希表
查看>>
Forcing the Removal of a Domain Controller
查看>>
find命令、文件名后缀
查看>>
C 语言学习笔记
查看>>
redhat5.8日志文件远端存放
查看>>
我的友情链接
查看>>
华为网络规划
查看>>