如何在浏览网站时保持动态切换的样式表

Question

我已经实现了一个通过jQuery:切换样式表的解决方案

http://www.paulund.co.uk/switch-stylesheets-with-jquery

以下是从上述网站复制粘贴的确切代码：

(function ($j) {
  switch_style = {
    onReady: function () {      
      this.switch_style_click();
    },
    switch_style_click: function(){
    $(".box").click(function(){
        var id = $(this).attr("id");
        $("#switch_style").attr("href", id + ".css");           
    });
    },
  };
  $j().ready(function () {
      switch_style.onReady();
  });
})(jQuery);

前提是给样式表引用一个id（例如#switch_style），并在单击另一个元素时切换"href"属性。

这很好，但当我在页面之间导航时，样式表会恢复到页面加载时显示的原始样式表。

所以我的问题是：

如何使动态切换的样式表在浏览网站时保持不变？

PS

顺便说一句，我曾考虑过调整主要内容区域以防止页面重新加载，我很想这样做，但还没有找到一个可行的解决方案。我已经尝试实现以下解决方案好几次了，但都没能实现：

https://github.com/balupton/jquery-ajaxy

Answer 1

您可以将用户选择的样式表存储在cookie中，然后在页面更改时，如果您的服务器有动态语言（例如PHP），则使用该语言来更改输出的样式表，如果没有，则使用jQuery读取它设置的cookie，并根据cookie值更改样式表。