Question

我创建了一个使用localStorage保存和删除数据的简单应用程序。问题是当我删除一个项目时，它只删除值而不是键，所以当我加载所有项目时，我删除的那些都是null（当然），我一直在寻找删除密钥的方法，是有办法删除它吗？任何帮助表示赞赏。

P.S。：如果您无法在此处使用代码，请尝试 this

我的代码：

<html>

<head>
  <script type="text/javascript" src="http://code.jquery.com/jquery-latest.min.js"></script>
</head>

<body>
  <div id="main">

    <label>Task</label>
    <textarea id="descrip"></textarea>

    <button onclick="saveItUp();" id="save">Save it</button>
    <button onclick="deleteItUp();" id="delete">Delete</button>
  </div>
  <script>
    var taskCounter = Number(localStorage.getItem("count")) + 1;
    var name = taskCounter;
    var deleteTemp = 0;

    for (var i = 1; i < taskCounter; i++) {
      var temp = i;
      document.writeln("<br/>" + '<input type="radio"  name="rad" value="' + temp + '" /> <label>' + 'Code: ' + temp + ' | Value: ' + localStorage.getItem(temp) + '</lable>');
    }

    function saveItUp() {
      var desc = $('#descrip').val();
      alert(desc);
      // Store
      localStorage.setItem(name, desc);
      localStorage.setItem("count", taskCounter);
      // Retrieve
      console.log(localStorage.getItem(name));
      console.log(localStorage.getItem("count"));
      location.reload();
    }

     //This is where I'm trying to do that, I know selected doesn't exist, but I put it just for a better comprehension
    $('input:radio').change(function() {
      if (this.checked) {
        deleteTemp = this.value;
        alert(this.value);
      }
    });

    function deleteItUp() {
      if (deleteTemp !== 0) {
        localStorage.removeItem(deleteTemp);
      } else {
        alert('radio is not checked!');
      }
    }
  </script>
</body>

</html>

Answer 1

请参阅documentation for localStorage.getItem：

包含键值的DOMString。 如果密钥不存在，则返回null。

所以删除了该项目。它只是像任何其他不存在的密钥一样返回null。

您可以检查使用以下内容定义的所有密钥：

var n = 0, key;
while (key = localStorage.key(n++)) console.log(key);

你会发现你删除的密钥实际上已经消失了。

Answer 2

密钥对存储为localStorage的属性，因此您只需删除该属性，该属性也将删除该值。

delete localStorage.count; // deletes both the key and value

如何从localStorage中删除项目及其密钥？

2 个答案: