ExtJS 用Cookie更换主题

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');

}

});