前端 easyui動態切換主題

2021-09-11 20:41:26 字數 1637 閱讀 7529

引入easyui的jsp頁面

從cookies獲取

<%

// 主題設定

string themename = "default";

cookie cookies = request.getcookies();

//以下**根據個人情況自己寫,原理就是找到指定名稱的cookie就將此名稱的cookie值賦值賦值給定義的變數

if(cookies != null && cookies.length > 0)

} }%>

引入css樣式

/easyui.css">

初始載入的.js檔案增加方法

jquery.cookie = function(key, value, options) , options);

if (value === null)

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

return (document.cookie = [

encodeuricomponent(key),

'=',

options.raw ? string(value) : encodeuricomponent(string(value)),

options.expires ? '; expires=' + options.expires.toutcstring(): '',

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

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

options.secure ? '; secure' : '' ].join(''));

} options = value || {};

var result, decode = options.raw ? function(s) : decodeuricomponent;

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

};/**

* 更換主題

*/function changethemefun(themename)

}$.cookie('easyuithemename', themename, );

}$(document).ready(function()

});

切換主題方法 : [依照實際有的主題編寫即可]

預設風格

gray

bootstrap

black

metro-blue

metro-gray

metro-green

metro-orange

metro-red

ui-cupertino

ui-dark-hive

ui-pepper-grinder

ui-sunny

ps : 除基本js外,還需引用jquery.jdirk.js

easyui動態切換主題

easyui換主題,並記錄在cookie 首先將easyui的樣式檔案加入乙個id,這裡命名為easyuitheme,然後在樣式檔案下面加入乙個js檔案 changeeasyuitheme.js檔案的內容是 function changethemefun themename katex parse ...

easyui切換主題

首先頁面肯定先導入easyui相關的 相關介面,我定義了乙個切換主題的 更換 default black bootstrap gray metro metro blue metro gray metro green metro red metro orange ui cupertino ui dar...

nz zorro 主題切換 動態

npm i less d less plugin clean css d以黑暗主題為例,使用less編譯應用的樣式入口檔案,並且在modifyvars引數中替換樣式變數,並輸出到目標位置。在目錄下建立theme.js檔案,然後拷貝如下 中的path需要修改為,專案的路徑,可以是相對路徑,不過我用的絕...