Question

我想使用 JavaScript 和 localStorage 制作我自己的待办事项列表。写入输入并按下发送按钮后，项目将被添加并显示在屏幕上。项目旁边会出现一个删除按钮。但是当我按下删除按钮时，控制台显示：Uncaught ReferenceError: key is not defined at HTMLButtonElement.onclick (index.html:21)。

with(df, subset(df, !(classification == "RD" | classification == "D1"))) -> df

const inpKey = document.getElementById("inpKey");
const inpValue = document.getElementById("inpValue");
const add = document.getElementById("add");
const items = document.getElementById("items");

add.onclick = function() {
  const key = inpKey.value;
  const value = inpValue.value;
  if (key && value) {
    localStorage.setItem(key, value);
    location.reload();
  }
};

for (let a = 0; a < localStorage.length; a++) {
  const key = localStorage.key(a);
  const value = localStorage.getItem(key);
  items.innerHTML += `${key}: ${value} <button type='button' onclick='deleteItem(${key})'>Delete</button><br>`;

  function deleteItem(key) {
    localStorage.removeItem(key);
    location.reload();
  }
}

Answer 1

当您加载浏览器时，将当前的本地存储数据写入一个数组/对象，但是您想设置它。

根据数组/对象大小，您可以通过这种方式对它们进行 ID，当您将它们输出到您的页面时，您需要 setAttribute("id", "currentcount")。

并在任何退出按钮上运行一个窗口侦听器以获取指针向下，只需检查数组/对象的 ID 循环，删除该项目并重新保存 localstorage。

没有代码，但应该可以帮助您，您已经接近了。

使用 localStorage 使用 JavaScript 列出待办事项

1 个答案: