Javascript 网站记住按钮按下

我有一个问题，让我的网站记住一个按钮按下。该网站自动播放音乐，并有静音按钮，但它不记得你在进入下一页或刷新页面时是否按下了该按钮。该本地存储脚本似乎不起作用

函数静音（）{
var audio=document.getElementById（“音乐”）
var toggle=document.getElementById（“toggle”）
if（audio.muted==true）{
audio.muted=false
toggle.innerHTML=“静音”
}否则{
audio.muted=true
toggle.innerHTML=“取消静音”
}
}

您的浏览器不支持音频元素。
var audio=document.getElementById（“音乐”）；
audio.volume=0.3；
哑巴
setItem（'toggle'，'true'）；
localStorage.getItem（'toggle'）；//返回“true”

每次页面刷新时，您的原始脚本都会将

'toggle'

设置为

true

这应该按预期工作，请参见JSFIDLE中的（单击按钮后再次尝试按

Run

，以确认它正确存储了值）： （由于代码段沙盒环境），以下代码无法工作）'

切换
函数切换（）{
让isToggle=+localStorage.getItem（'toggle'）；
如果（！isToggle）{
setItem（'toggle'，1）；
document.getElementById（'txt'）.innerHTML='Toggled'；
}否则{
setItem（'toggle'，0）；
document.getElementById（'txt'）.innerHTML='nottoggled'；
}
}
addEventListener（“DOMContentLoaded”，函数（事件）{
if（+localStorage.getItem（'toggle'））{
document.getElementById（'txt'）.innerHTML='Toggled'；
}否则{
document.getElementById（'txt'）.innerHTML='nottoggled'；
}
})

您的IF语句检查布尔值是否为TRUE，但是您的本地存储变量被设置为字符串“TRUE”

即使本地存储更现代，您也可以在js中设置和获取cookie。我不太明白这一点，我应该如何实现？当我按下“静音”按钮时，它会将音乐静音，当我再次按下时，它会将按钮文本更改为“取消静音”。试图让网站记住您是否将音乐静音。@trygaba使用与我的代码相同的逻辑：当用户第一次访问网站并且文档准备就绪时，您可以检查localStorage是否已将

mute

设置为true。如果不存在，我假设它为false，保存默认值，并基于该值渲染按钮文本（使用普通DOM操作）。稍后，当用户单击按钮时，我们根据存储的值更新localStorage

mute

值，并使用DOM操作更改按钮文本。当用户稍后重新访问页面时，我们会在加载文档时检查localStorage，并根据设置按钮文本that@trygaba看看这个？在我得到它之后，它终于起作用了。我应该做的是：谢谢你，我自己也弄明白了，但只是花了一些时间：）你的解决方案看起来也不错。@trygaba很高兴你弄明白了。你也可以在上面的评论中与我的版本进行比较