Javascript 如何使.toggleClass按钮单击在不同页面上保持其效果？

我一直在开发一个网站，它利用一个按钮在背景/导航栏/文本颜色的正面和负面主题之间切换整个外观，这取决于用户的喜好。我用一个简单的toggleClass方法完成了主页：

 $(document).ready(function(){ 
    $('.switchButton').click(function(){
         $('.mainBg').toggleClass("bg-inv");     
     });
 });

---

我怎样才能使它在用户加载网站的任何其他页面时，以之前选择的主题打开（例如，如果您所在的页面为负数，则在您更改为正数之前，所有页面都将为负数）？我计划在每一个页面上插入一个开关，但每次你想使用第二个主题时都要轻弹开关，这是非常烦人的。我曾考虑过IF jquery函数，但不确定如何在不同页面之间使用它

您可以将该值保存在cookie中，并在每个页面中加载，以便在页面之间保持该值。

您可以将该值保存在cookie中，并在每个页面中加载，以便在页面之间保持该值。

HTTP是无状态的。这意味着连接之间的数据不会保存，并且每个请求都是基于服务器上的代码的新请求

如果要跨请求保存数据，则必须将其保存在不依赖于请求的位置。这可以在cookie、会话变量、数据库中，也可以使用localstorage

---

您只能直接从JavaScript访问cookie，因此这将是最简单的选择。

HTTP是无状态的。这意味着连接之间的数据不会保存，并且每个请求都是基于服务器上的代码的新请求

如果要跨请求保存数据，则必须将其保存在不依赖于请求的位置。这可以在cookie、会话变量、数据库中，也可以使用localstorage

---

您只能直接从JavaScript访问cookie，因此这是最简单的选择。

假设您创建了一个名为

class。现在在toggleClass函数中写入
class=a
，其中
a
是传递给toggleClass的变量，在本例中为bg inv。现在，您可以通过
localStorage['class']=class
将
class
保存在本地存储中，并在需要时使用
localStorage['class']
或
localStorage.getItem（'class'）
检索它。希望这对您有所帮助
 假设您创建了一个名为
class的变量。现在在toggleClass函数中写入
class=a
，其中
a
是传递给toggleClass的变量，在本例中为bg inv。现在，您可以通过
localStorage['class']=class
将
class
保存在本地存储中，并在需要时使用
localStorage['class']
或
localStorage.getItem（'class'）
检索它。希望这对您有所帮助
 在主页上，您可以将值存储在sessionStorage中，在每个页面上，您都可以从sessionStorage变量中检索值

  $(document).ready(function(){ 

    $('.switchButton').click(function(){

          $('.mainBg').toggleClass("bg-inv");
          sessionStorage.class = "bg-inv";

    });     
});

在每一页上都可以检查变量

$(document).ready(function(){ 
    if(typeof(Storage) !== "undefined") {
          $('.mainBg').addClass(sessionStorage.class);
    }

});

在主页上，您可以将该值存储在sessionStorage中，在每个页面上，您都可以从sessionStorage变量中检索该值

  $(document).ready(function(){ 

    $('.switchButton').click(function(){

          $('.mainBg').toggleClass("bg-inv");
          sessionStorage.class = "bg-inv";

    });     
});

在每一页上都可以检查变量

$(document).ready(function(){ 
    if(typeof(Storage) !== "undefined") {
          $('.mainBg').addClass(sessionStorage.class);
    }

});

使用cookie保存首选项使用cookie保存首选项