如何将自定义宽度保存到cookie中？

Question

我在做一个变宽器。我用jQuery来做这个，但我有个问题。这个想法是，当用户单击按钮时，宽度会立即改变。我想将用户的选择保存在cookie中，但我不知道该如何做。

当前的jQuery代码：

$(function()
{
  $(".width-changer").on("click", function(e)
  {
    $(".wrapper").toggleClass("custom-width");
  });
});

我用这个插件来做饼干：

<script src="http://cdnjs.cloudflare.com/ajax/libs/jquery-cookie/1.3.1/jquery.cookie.js"></script>

在我的index.html里。

包装类是我的全局宽度。

Answer 1

这是我在i.explorer & Firefox中使用的解决方案，对于chrome，我认为您应该启用cookies：

$(function()
{
    if ($.cookie('custom_width')=='true') { //add true to this condition
        $(".wrapper").addClass("custom-width");
    };

  $(".width-changer").on("click", function(e)
  {
    $(".wrapper").toggleClass("custom-width");

    if($(".wrapper").hasClass("custom-width"))
        $.cookie('custom_width', 'true');
    else
        $.cookie('custom_width', 'false');

  });
});

希望这个解决方案对你有帮助。

Answer 2

我想这也是一样的：

https://github.com/carhartl/jquery-cookie

这两种方法都没有经过测试：

$(".width-changer").on("click", function (e) {
    var control = $(".wrapper");
    control.toggleClass("custom-width");
    if (control.hasClass("custom-width")) {
        $.cookie('WidthOption', 'custom-width');
    }
    else {
        $.cookie('WidthOption', '');
    }
});

或

 $(".width-changer").on("click", function (e) {
        var control = $(".wrapper");
        control.toggleClass("custom-width");

        $.cookie('WidthOption', control.width());
    });

提取cookie值：

    $.cookie('WidthOption');

Answer 3

您可以使用本地存储localStorage