0

我有在点击时设置和清除 cookie（记住 div 的样式）的工作代码：

var originalAttributes = $('.aaa').attr('style');
$('.aaa').each(function(){
    var d = $(this),
    id = d.attr('id'),
    storedStyle = $.cookie('aaaStyle' + id);
    if (storedStyle != undefined){   //style stored
        d.attr('style', storedStyle);
    }
});

//mouse event functions for class="aaa"

$('#save').click(function () {
    $('.aaa').each(function(){
        var d = $(this),
        id = d.attr('id'),
        style = d.attr('style');
        if (style != originalAttributes){   //style changed
            $.cookie('aaaStyle' + id, style, { expires: 30 });
        }
    });

});

$('#clear').click(function () {
    // unset changes
    $('.aaa').attr('style',originalAttributes).each(function(){
        var d = $(this),
        id = d.attr('id');
        $.cookie('aaaStyle' + id, null);
    });
});

http://jsfiddle.net/z8KuE/31/

唯一出现的问题是当我必须处理大量相同类的 div 时 - cookie 大小可以达到 500kb 或更多。浏览器仅支持每个 cookie 4kb。

所以问题是 - 如何使用这个函数和 jquery cookie 插件来避免这个问题？- gzip 或 / 并将 cookie 分成足够小的部分？

（无论哪种方式，最好进行某种压缩以加快性能（如果可能 - 但如果没有，没关系））

编辑：如何使用本地存储实现相同的“保存 - 清除”功能？

edit2：由 user2111737 ( http://jsfiddle.net/z8KuE/33/ ) 解决 - 使用本地存储而不是 cookie 并且无需 cookie 插件即可工作。

4

1 回答 1

1

如果您不需要在服务器端访问它，或者最终可以使用 xmlhttprequest 手动将此数据发送到服务器，我认为您应该尝试 localStorage，最终使用 sessionStorage 而不是 cookie，那么您有 20mb（IE 中为 200，但与其他网站）。关于压缩 - 您可以考虑自定义格式并使用动态存储的数据重建 html 代码 - 例如。我怀疑这个类绝对可以是任何东西——我想它可以保存为数字——甚至更好——一个字符。它为您提供了保存为一个标志的 255 个课程

于 2013-10-01T15:26:59.957 回答