ExtJS 用Cookie更换主题 - [ExtJS]
版权声明:转载时请以超链接形式标明文章原始出处和作者信息及本声明
http://micki.blogbus.com/logs/37622244.html
每次打开页面,要让系统使用上次设置的主题皮肤,得用cookie来保存:
1.在主页面里引入
<link rel="stylesheet" type="text/css" href="lib/ext2.2/resources/css/ext-all.css"/>
<link rel="stylesheet" type="text/css" href=""/>
其中第二个是为了换肤时使用
2.根据cookie得到上次设置的主题
var cookiesArr = document.cookie.split(";");
var cssName = "";
for(var i=0; i<cookiesArr.length; i++){
var arr = cookiesArr[i].split("=");
if(arr[0] == "css"){
cssName = arr[1];
break;
}
};
if(cssName != ""){
Ext.util.CSS.swapStyleSheet('theme', "lib/ext2.2/resources/css/" + cssName + ".css");
}
3.在设置主题事件里保存cookie,并加载新主题(此处使用combobox下来选择来触发)
Ext.getCmp('themeSelect').on('select', function(combo){
var name = combo.getValue();
var date=new Date();
date.setTime(date.getTime() + 30*24*3066*1000);
document.cookie="css=" + name + ";expires=" + date.toGMTString();
if(name == 'default'){
Ext.util.CSS.swapStyleSheet('theme', 'lib/ext2.2/resources/css/ext-all.css');
}else{
Ext.util.CSS.swapStyleSheet('theme', 'lib/ext2.2/resources/css/' + combo.getValue() + '.css');
}
});