从本地存储中删除笔记答案

【问题标题】：delete a note from localstorage从本地存储中删除笔记
【发布时间】：2019-03-22 13:55:36
【问题描述】：

我正在使用这个 codepen https://codepen.io/anon/pen/jJXmpZ，但我正在努力为每个笔记实现一个新的删除按钮。

我已经在我的 html 中添加了这个：

<input id="delNote" value=" delete note" type="button" />

我在脚本中添加了这个函数

function deleteNote(note) {
    localStorage.removeItem(note);
}

但是，好像我做错了什么，删除按钮没有响应。

非常感谢任何帮助。

Codepen

【问题讨论】：

codepen 对我有用。
我不是说它不起作用，我是说它没有删除单个笔记的方法，只是清空localStorage。我正在尝试实现该方法。
那么你应该更新你的代码笔以包含你说的按钮不起作用
检查codepen，它已更新。
您没有向删除函数发送注释，只是事件正在传递。

标签： javascript local-storage

【解决方案1】：

首先要指出的是，当您单击该函数时，您从未真正调用过它。

【讨论】：

我教过我使用 $(document).on('click', '#delNote', deleteNote);

【解决方案2】：

像这样调用删除函数： <input id="delNote" value=" delete note" type="button" onClick="deleteNote(XXXX);"/>

XXXX 是你的笔记，或者你指的是你的笔记（我猜是某种 ID）

【讨论】：

【解决方案3】：

你是

localStorage.setItem('note_'+note.length, note);

note.length 是输入表单长度，不是唯一变量，也不是顺序的。

在开发者工具的console.log 中输入localStorage 以查看localStorage 中的内容。

并尝试删除

localStorage.removeItem(note); // note is an object object not a key.

note 不是 'note_'+note.length 的关键。

每次两个音符的长度相同时，最后一个音符会删除/替换第一个音符，并且您没有键列表来引用要删除的音符。我建议通过每次创建笔记时计数并使用计数作为键来设置或创建键索引。

localStorage.count

然后你可以添加到

if (localStorage.count) {
   localStorage.count = localStorage.count+1
   } else {
   localstorage.count = 1; // no notes begin at 1.
   }
localStorage.setItem('note_'+localStorage.count, note);

并删除最后一个音符

if (localStorage.count) {
   localStorage.removeItem('note_'+localStorage.count);
   localStorage.count = localStorage.count-1
   } else {
      // no notes localStorage count is zero or undefined? same difference here.
   }

您还需要更新显示循环，因为它将所有 localStorage 显示为注释。

或者你可以使用 localStorage.length，

localStorage.setItem('note_'+localStorage.length, note);

和

localStorage.removeItem('note_'+localStorage.length);

但是，如果在 localStorage 中放置了除笔记以外的任何内容，则假设的逻辑会破坏 deleteNote(localStorage.length)

无论哪种方式，您都可以在笔记的右上角放置一个 X 来调用 deleteNote(key)，但仍需要更新显示循环。

因此。

function deleteNote(note) {
        localStorage.removeItem(note);
    }

从 X 调用：

deleteNote(key);

【讨论】：