Question

对于我正在处理的网站，我正在尝试保存您购买的商品数量，以便在html网页上显示。研究如何做到这一点让我相信Html sessionStorage是最好的方法（如果有更好/更简单的方式请告诉我）。然而，每当我刷新html页面或转到另一页面时，数据都会重置。

这是我的代码：

 function initialize(name, val) {
if(localStorage.getItem(name) === null) {
  localStorage.setItem(name, val);

   }

}

initialize("subCost", 0);
initialize("quantity", 0);
initialize("hasProduct", false);

然后由于存储只存储字符串，我将它们转换为整数和布尔值

var $quantity = parseInt(localStorage.quantity);
var $subCost = parseInt(localStorage.subCost);
var $hasProduct = localStorage.hasProduct == "true";

在没有初始化功能之前，我制作了像这样的本地存储项目

localStorage.setItem("subCost", 0);
localStorage.setItem("quantity", 0);
localStorage.setItem("hasProduct", false);

仍然将这些转换为那些变量，但它们从未在每次刷新时保存。我如何通过每次刷新来保存这些更改。

Answer 1

.setItem()上的localStorage方法不仅会“设置”某个值的“内存占位符”......如果它已经存在，它也会覆盖它。

要保存用户生成的值，保存“更改”的最佳“时刻”是change事件。

使用与.setItem()功能相同的initialize()方法。

$("input").on("change",function(){

  // Get id and value.
  var id = $(this).attr("id");
  var value = $(this).val();

  // Save!
  localStorage.setItem(id,value);
});

CodePen

<小时/> 正如暗示......
这种在本地保存值的方法是短暂的...
保留值直到用户关闭浏览器 不只是关闭页面，而是完全关闭浏览器因此，为了在页面之间保持一些值导航，这是最佳用途。

要存储较长时间的值（例如6个月或更长时间），请使用Cookie 看看jQuery Cookie plugin。

Html Storage重置每次刷新，初始化功能不起作用

1 个答案: