切换switch 保持上次状态，即使在重新加载时也是如此
我使用的是W3School (this one)的拨动switch .在W3School编辑器中，它在重新加载时返回到已建立的"选中"或"未选中"位置，但无论出于什么原因-如果我"选中"我的，然后重新加载，它将保持选中状态，或者如果我取消选中然后重新加载，它将保持未选中状态.
对于我正在做的项目来说，重要的是在初始加载/任何重新加载/重新访问时取消选中它.
我很好奇这是不是有缓存问题，因为我是在我的电脑上本地处理它(编辑html的写字板，查看文件的Firefox)，但我将我的工作上传到了NeoCities，问题仍然存在，所以我认为这意味着这是代码本身.
<head>
<style>
.selector {
background-color:rgba(255, 255, 0, 0.3);
text-align:center;
border:1px solid gold;
width: 50vw;
max-width:500px;
border-radius:2em;
padding:1em;
font-size:20px;
color:gold;
margin:2em auto auto;
}
.switch {
position: relative;
display: inline-block;
width: 50px;
height: 24px;
}
.switch input {
opacity: 0;
width: 0;
height: 0;
}
.slider {
position: absolute;
cursor: pointer;
top: 0;
left: 0;
right: 0;
bottom: 0;
background-color: darkblue;
-webkit-transition: .4s;
transition: .4s;
border-radius: 34px;
}
.slider:before {
position: absolute;
content: "";
height: 16px;
width: 16px;
left: 4px;
bottom: 4px;
background-color: gold;
-webkit-transition: .4s;
transition: .4s;
border-radius: 50%;
}
input:checked + .slider {
background-color: cornflowerblue;
}
input:checked + .slider:before {
-webkit-transform: translateX(26px);
-ms-transform: translateX(26px);
transform: translateX(26px);
}
</style>
</head>
<body>
<div class="selector">Unchecked
<label class="switch">
<input type="checkbox" onclick="hoverFunction()">
<span class="slider" alt="toggle switch button"></span>
</label>
Checked</div>
</body>
我怎么才能解决这个问题呢？