easyui换主题,并记录在cookie

首先将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‘);

时间: 2024-10-12 15:32:47

easyui换主题,并记录在cookie的相关文章

EasyUI更换主题

EasyUI默认的主题有几个 EasyUI的使用需要导入 <script type="text/javascript" src="/resources/js/lib/easyui/jquery.min.js"></script> <script type="text/javascript" src="/resources/js/lib/easyui/jquery.easyui.min.js">

Cookie中图片的浏览记录与cookie读取servle时路径的设置(文字描述)

public class ShowServlet extends HttpServlet { public void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { doPost(request, response); } public void doPost(HttpServletRequest request, HttpServletR

换主题

你需要到网址:https://hexo.io/themes/找到你想要的主题 点击进入然后找到博主的这个主题博客的网址下载到你建立好的文件下的themes文件通过git的bash用命令 git clone 加网址下载 大专栏  换主题主题然后回到上一级用命令 vim _config.yml进入这个文件修改themes的值 (注意:这就是你下载在themes里文件的名字) 然后Ctrl+C加两个大写ZZ退出通过 hexo clean+hexo g+hexo d 改变主题 原文地址:https://

easyui切换主题

easyui 1.4.2下载地址:点击打开链接 主题有十多个吧 jquery cookie下载地址:点击打开链接 首先页面肯定先导入easyui相关的: 相关界面,我定义了一个切换主题的 <div style="position: absolute;right: 14px;top:42px;"> <div class="easyui-panel" style="padding:5px;font-size: 20px;font-weight

easyui更换主题之后出现validatebox的验证提示信息显示跑偏的解决方案

在easyui中更换主题为非default的主题,有的主题会出现如下图所示的情况,验证提示信息的提示内容跑到了下面. 现在说下原因和解决方案: 原因:原因是easyui对某些主题没有进行这个样式的设置,导致这个验证信息会到处跑. 首先,通过firebug可以看到出现上面问题的jsp页面有如下图的html,这段html内容就是提示信息所在的html,可以找到下面的class="validatebox-tip-content"的span,之所以出现验证提示信息乱跑的情况的原因是easyui

sublime text2 换主题

网上看到一款喜欢的主题,换掉初始的主题,感觉颜色浅一点会比较好看,看中了下面这款. 后来看到有在 github 上的人做的 ,这是地址 ,上面也有详细的如何更改的步骤,下面是我自己这里做个备份. 1.首先下载这个该zip文件, http://pan.baidu.com/s/1hq33cpQ (提取码88x7 ) 2.解压并将解压后的文件改名为  Theme - Spacegray 3.放入到Packages目录中,Packages目录可以在sublime中 Sublime Text -> Pre

[转]jQuery EasyUI 扩展-- 主题(Themes)

主题(Themes)允许您改变站点的外观和感观.使用主题可以节省设计的时间,让您腾出更多的时间进行开发.您也可以创建一个已有主题的子主题. 主题生成器(Theme Builder) jQuery UI 主题 许多扩展的主题是基于 jQuery UI 主题创建的,它们不是官方发布的. Sunny Pepper Grinder Cupertino Dark Hive Metro 主题 下面的扩展主题是基于 Metro 主题创建的. Metro Blue Metro Gray Metro Green

android 换肤换主题(apk包方式)

更换皮肤的方式有很多种,有更换背景图片的(图片来源于程序资源文件.sdCard.网络下载).有更换theme样式的.也有apk的等等. 用apk的方式更换程序皮肤,这样的方式,方便,简单,而且使主程序的apk包较小. 先下载皮肤apk包,安装,然后使现在的程序读取新安装的apk包中的资源文件,下次再打开程序时,依旧读取的是上次设置的apk的资源,如果主题apk被卸载,那么就读取的是默认的资源. 核心代码(完整代码见项目压缩包)如下: 主程序: 读取已经安装了的皮肤包的包名.应用图标和应用名称,当

jQuery EasyUI 1.4更新记录

问题: menu:修复当删除一个menu项时.menu高度不准确. datagrid:修复当datagrid宽度太小时,fitColumns方法不能使用. 改进: 1.为easyui全部组件新增了自适应/百分比宽度支持 2.menu:新增showItem.hideItem.resize方法 3.menu:能够依据窗体大小自己主动调整高度 4.menu:新增duration属性.用户可自己定义在一定毫秒内收缩menu 5.validatebox:新增onBeforeValidate.onValid