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

How can I save my custom width to a cookie?

我正在研究宽度变换器。我为此使用 jQuery,但我遇到了问题。这个想法是当用户点击按钮时,宽度会立即改变。我想将用户的选择保存在cookie中,但我不知道该怎么做。

当前jQuery代码:

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

我将这个插件用于 cookie:

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

它在我的 index.html.

wrapper class 是我的全局宽度。

您可以使用本地存储 localStorage

这是我在 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');

  });
});

希望此解决方案对您有所帮助。

我假设这是一样的:

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');