Question

我试图将这个小提琴：http://jsfiddle.net/jaredwilli/ReT8n/整合到一个小提琴中：

https://jsfiddle.net/vlrprbttst/99c8gn7k/

基本上你有一个篮子里面有一些物品，你可以添加或删除它们。我想要的是，在页面刷新时，html()的{{1}}保存在本地存储中。我被困在这里：

https://jsfiddle.net/vlrprbttst/z8cffk4c/

我已将.basket变量放在点击处理程序中，否则，var不会自行更新，但现在我猜测最终的本地存储代码

forLocalStorage

无效，因为它无法检索变量？

我尝试过搬家，但我已经被困在这里了。我做错了什么？

Answer 1

设置变量后需要更新DOM，例如：

 // LOCAL STORAGEEEEEEEE
  if (localStorage.getItem('toDoData')) {
    forLocalStorage = localStorage.getItem('toDoData');
    $('#cart').html(forLocalStorage);
    itemsCount();
  }

Answer 2

本地存储只能存储string key value pairs。我确保你传入一个字符串，并添加了一个函数来刷新购物车，解决了问题。

function populateCart() {
    var items = localStorage.getItem('toDoData') || '';
    $('#cart').html(items);
}

在document.ready中添加了此调用，如下所示： -

$(document).ready(function() {
    populateCart();
    // rest of code
});

工作CodePen：http://codepen.io/owenayres/pen/oxKmZg

您可以在本地存储上轻松阅读here。在我看来，最佳做法是将HTML的数据存储为本地存储中的一些JSON，然后您可以循环并重新生成HTML以便再次读取此数据。

使用localstorage来保持页面刷新上的html不起作用

2 个答案: