为什么我的cookie不更新？

Question

我正在使用按钮切换为网站设置暗模式。 为了在更改页面时保持暗模式保存，我正在使用cookie。 再次按下切换开关时，黑暗模式将被禁用，但无法保存，我不确定为什么。

PS。 我是JavaScript新手，所以这可能是一个愚蠢的错误。

if ($.cookie('darkModeOn')){
      $('html').toggleClass('dark-mode');

      $('#dark-toggle').click(function(){
      $.cookie('darkModeOn', false, { expires: 7 });
      $('html').toggleClass('dark-mode');
      });
   }
   else
   {
      $('#dark-toggle').click(function(){
      $.cookie('darkModeOn', true, { expires: 7 });
      $('html').toggleClass('dark-mode');
      });
    }

Answer 1

当您按下切换按钮时，您还想切换cookie的True / False值。 现在，根据第一个状态，您始终可以将其设置为True或False。

使用! $.cookie('darkModeOn') ! $.cookie('darkModeOn')作为值存储在cookie中，以自动切换布尔值。

---

编辑

它确实不起作用，我发现由于布尔值，它不起作用。 布尔值存储为字符串（ "false"和"true" ），因为if ( "false")为布尔值true，则始终执行if。 当您使用整数而不是布尔值时，这将起作用，但是您也可以将if更改为：

if ($.cookie('darkModeOn')=="true") //...

---

如果使用整数，它也可以工作：

https://jsfiddle.net/6m2ydrh2/12/

$('#dark-toggle').click(function(){
       //this gets executed each click so we need to toggle the boolean value.
      if ($.cookie('darkModeOn')==0){
          $.cookie('darkModeOn', 1, { expires: 7 });
      }else{
          $.cookie('darkModeOn', 0, { expires: 7 });
      }
      console.log( "cookie:"+$.cookie('darkModeOn')) ;
      $('#test').toggleClass('dark-mode');
  });
  if ($.cookie('darkModeOn')){
       //this is only executed on load
      $('#test').toggleClass('dark-mode');
  }

另请参阅此帖子： jquery cookie将value设置为boolean true 。 布尔值存储为字符串，因此会引起问题。