单击时访问本地存储中的键值未按计划工作

Question

我正在尝试使用本地存储，用户键入他们的名字和一些文本，并使用javascript创建一个简单的留言板，它显示在表单下方。

当我单击删除按钮而不是记录文本时，其日志记录"删除"(按钮的文本内容( 我有一个名为 text 的变量，它应该保存用户提交的消息的文本，我无法找出这里出了什么问题。

**function removeMessage(text){
console.log(text);
}**

function fetchMessages(){
let messages=JSON.parse(localStorage.getItem('messages'));
const messageBoard=document.querySelector('#messageBoard');
messageBoard.innerHTML="";
for(let i=0; i<messages.length; i++){
const name= messages[i].name;
**const text=messages[i].text;**
messageBoard.innerHTML+=
`<div class="all">
<div class="names">
<h3>${name}</h3>
</div>
<div class="messages">
<p>${text}</p>
</div>
<div class="button">
**<a onclick="removeMessage(text)" href="#" id="delete">Remove</a>**
</div>
</div>`;
}
}

Answer 1

当你点击<a onclick="removeMessage(text)" href="#" id="delete">Remove</a>时，你没有一个名为text的全局变量，text指的是<a>元素的this.text，即Remove。也许您应该用removeMessage(${text})替换removeMessage(text)或使用指向该条目的某种索引。