jquery - Jquery Cookie onclick 功能

Question

当用户单击它们时，我在 jQuery 中有这个函数用于隐藏元素：

  $(".colabs-image").click(function() {
    $( this ).parent().addClass('is-visited');
  });

我想使用 cookie 来存储用户点击的元素，并在下次访问时显示。

Whit$(this).parent().attr('href'))我有一个元素的 ID，但我知道如何管理这个任务的 cookie。

Answer 1

看看jQuery Cookie插件。它使使用 cookie 变得非常简单。

创建 cookie 非常简单：

$.cookie('the_cookie', 'the_value');

如果要将元素存储在 cookie 中，则需要做更多的工作。如果您的元素的 id 是静态的，那么您可以将它们存储在一个数组中，然后使用以下方法将其存储到 cookie 中JSON.stringify：

var elements = [];
$(".colabs-image").click(function() {
    $(this).parent().addClass('is-visited');
    elements.push($(this).parent().attr('id')); //add the id to the array of elements
    $.cookie('elements', JSON.stringify(elements));
});

要检索元素，您必须使用JSON.parse：

var elements = JSON.parse($.cookie('elements'));
for(var i = 0; i < elements.length; i++) {
    $("#" + elements[i]).addClass('is-visited');
}