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

}

});