Question

我在WordPress上构建一个图片库，我想在灯箱中添加一个保存或保存到收藏功能，这样我只需点击一下按钮即可收集图像，然后再下载所有图像。它有点像购物车而没有真正购买你想要的东西。我希望它只是一个会话类的东西，所以你不需要注册到该网站。

因此，在我的图片页面上，我将一个“保存到灯箱”按钮，我想将此图像的ID保存到cookie，然后我不断添加图像，直到我完成并点击一个视图灯箱按钮，列出我收集的所有图像。

我知道如何设置Cookie，但我不知道如何为其添加值。

    function saveLightbox(ID){
      $.cookie('the_cookie', ID, { expires: 7 });
      document.getElementById("result").innerHTML = $.cookie('the_cookie');
    }

这里fiddle 大概是我希望它如何运作。

Answer 1

保存一个数组并将id推送到该数组：

var ids = $.cookie('the_cookie') || [ ];

function saveLightbox(ID){
  $.cookie('the_cookie', ids.push(ID), { expires: 7 });
  console.debug(ids);
  console.debug($.cookie('the_cookie'));
  document.getElementById("result").innerHTML = JSON.stringify($.cookie('the_cookie'));
}

（无法测试或演示atm，jsfiddle不适用（对我而言）。）

Answer 2

要将值附加到jQuery cookie，首先必须启用对象存储。然后初始化一个包含cookie内容的变量。如果cookie为空，则初始化一个空数组。接下来，将ID推送到数组。最后，将此数组存储在cookie中。

以下代码说明了上述内容：

function saveLightbox(ID){

  $.cookie.json = true;

  var idContainer = ($.cookie('the_cookie')) || [];

  idContainer.indexOf(ID) === -1 && idContainer.push(ID);

  $.cookie('the_cookie', idContainer, { expires: 7 });

  document.getElementById("result").innerHTML = $.cookie('the_cookie');

}

另一件需要考虑的事情是，一旦ID已经存储在cookie中，您可能希望阻止再次添加它，这就是第4行的原因。您可以在此处找到工作示例：jsfiddle. < / p>

将多个ID保存到一个jQuery cookie并稍后检索所有值

2 个答案: