Cookie 更改/切换/切换 CSS 类 jQuery 问题

Question

我找到了这个巧妙的解决方案，可以使用jquery.cookie更改背景颜色并将其存储到 cookie 中。做了一些调整，效果很好：

$(document).ready(function () {

 $("body").css("background-image",$.cookie("<?php echo $_SESSION['username_login']; ?>"));

     $("#background-change").change(function (event) {

       var img =  $(this).val();

        $("body").css("background-image",img);

         $.cookie("<?php echo $_SESSION['username_login']; ?>",img, {path: '/', secure: true});

     });

 });

现在我正在尝试基于此制作主题颜色更改女巫的默认类 .w3-blue-grey。这是我得到的最接近的：

$(document).ready(function () {

$(".w3-blue-grey").toggleClass($.cookie("<?php echo $_SESSION['username_login']; ?>col"));

    $("#color-change").change(function (event) {

      var col =  $(this).val();

       $(".w3-blue-grey").toggleClass(col);

        $.cookie("<?php echo $_SESSION['username_login']; ?>col",col, {path: '/', secure: true});

    });

});

正如您所看到的，我对 cookie 的名称进行了不同的处理，因此不会发生冲突，但由于某种原因，该代码无法正常工作。

我什至无法解释什么是错误，就像它有自己的想法一样，有时它会改变颜色，但错误的颜色，然后不会回到默认状态，有时它根本没有给出任何类并且它是透明的.. .我只是不明白...

我尝试用switchClass而不是切换，但它也变得疯狂。

我注意到它可能与选择顺序有关（有时当我对其进行更改时），因此我也给出了我的 HTML 代码。

<select name="wall" id="background-change" class="w3-padding">

   <option>...</option>

   <option value='url("img/wall6.png")'>Glavna</option>

   <option value='url("img/wall2.png")'>Opcija 1</option>

   <option value='url("img/wall3.png")'>Opcija 2</option> 

</select>

向上是我选择更改背景并且有效。下面是我的主题切换器：

<select name="colour" id="color-change" class="w3-padding">

        <option >...</option>

        <option value='w3-blue-grey'>Light grey</option>

        <option value='w3-indigo'>Indigo</option>

        <option value='w3-blue'>Light blue</option>

</select>

我在这个问题上浪费了几个小时，我不知道我还能想到什么来解决这个问题，请指教。

Answer 1

我解决了...由于某些原因，切换类无法正常工作，所以现在我只是对类生成的样式进行更改。HTML select 中的值需要是您希望应用的完整样式。然后将其传递到cssText。       $(document).ready(function () {        $(".w3-blue-grey").css('cssText',$.cookie("<?php echo $_SESSION['username_login']; ?>col"));            $("#color-change").change(function (event) { var col =  $(this).val();  //window.alert(col);  $(".w3-blue-grey").css('cssText',col);   $.cookie("<?php echo $_SESSION['username_login']; ?>col",col, {path: '/', secure: true});   //location.reload();            });        });