Question

我有一个带有一些jquery的按钮，此按钮可将主题从暗切换为亮或从亮切换为暗。即使在页面刷新或更改为另一个页面后，我也希望保持此按钮为启用状态。我该怎么办！

Answer 1

您必须使用PHP将数据存储在cookies或Session中。
这样，即使刷新页面，更改也将被保存。
您还可以使用JavaScript将数据存储在Cookie中。
假设用户将背景颜色更改为＃33FFEA。
要将背景色存储在Cookie中，可以使用以下代码：

localStorage.setItem("backgroundColor", "#33FFEA");

现在，为了从Cookie接收数据，您可以使用以下代码：

document.body.style.backgroundColor=localStorage.getItem("backgroundColor");

要在页面加载时将保存的颜色直接添加到 <body> ，请使用以下代码（编译后的代码）：

<body onload="LightDarkMode()">
<script>
funtion LightDarkMode()
{
document.body.style.backgroundColor=localStorage.getItem("backgroundColor");
}
</script>

您必须记住，颜色已经存储在上述代码的cookie中。

Answer 2

您可以使用本地存储机制来实现这一点，我假设您具有如下功能来更改主题

function change_theme(){
 /*your change theme jquery*/
 localStorage.setItem("theme",'your css class'); //setting theme to local storage
}

要在页面上加载此内容

$( document ).ready(function() {
 var theme = localStorage.getItem('theme'); //getting back theme from localstorage  
 $( "body" ).addClass(theme);  //adding class to body tag
 });

保持主题在页面更改或页面刷新时启用

2 个答案: