Question

我想根据用户选择的内容保存切换状态。

我的代码如下所示：

<div id="wrapper">
  stuff here
</div>

<script>
   $("#menu-toggle").click(function(e) {
      e.preventDefault();
      $("#wrapper").toggleClass("toggled");
   });
</script>

如果我将类切换设置为id包装器，则默认切换div。

如何使用Cookie解决此问题？所以它记住了用户点击的内容，因此它将div eighter设置为切换或不在页面重新加载时切换。

Answer 1

我不确定饼干是否是最佳选择。也许localStorate是一个更可行，更容易的选择。

你可以像这样使用它：

$("#menu-toggle").click(function(e) {
   e.preventDefault();
   var element = $("#wrapper");
   element.toggleClass("toggled");
   if (element.hasClass("toggled")) {
     localStorage.setItem('toggled', 'true');
   } else {
     localStorage.setItem('toggled', 'false');
   }

 });

 // On load
 var element = $("#wrapper");
 var toggled = localStorage.getItem('toggled');;
 element.toggleClass("toggled");

 if (toggled == "true")
   element.addClass("toggled");
 else
   element.removeClass("toggled");

JSFiddle：https://jsfiddle.net/8tpxx71z/

更多信息： https://developer.mozilla.org/en-US/docs/Web/API/Web_Storage_API/Using_the_Web_Storage_API

使用jquery cookie保存切换状态

1 个答案: