当单击时，我在div中有一个图像按钮。我想隐藏图像按钮，并以某种方式存储到本地存储中，以便在页面刷新时不再显示div。
<div class="whatsapp"><a href="https://chat.whatsapp.com/........." target="_blank">
<img src="/img/whatsapp_group.png" alt="Whatsapp Join Button"><div class="whatsappbut">To Find Out MORE!</div></a></div>
我向您的div添加了一个ID(id="img-btn"(，以便在脚本标记中使用它。如果用户到目前为止没有点击您的图像按钮，localStorage.getItem('img-btn-clicked')将返回null，否则将返回"true"(正如我们在saveClicked函数中设置的那样(
只需确保在body标记结束之前放置script标记(或者您可以链接一个单独的Javascript文件(。
<body>
<div id="img-btn" class="whatsapp">
<a href="https://chat.whatsapp.com/........." target="_blank">
<img src="/img/whatsapp_group.png" alt="Whatsapp Join Button" />
<div class="whatsappbut">To Find Out MORE!</div></a>
</div>
<script>
checkImgBtnClicked();
function checkImgBtnClicked() {
const clicked = localStorage.getItem('img-btn-clicked'); // if this is not set it will return null
if (clicked) {
document.getElementById('img-btn').style.display = 'none'; // hides the img-btn
} else {
// add event listener for image button click(saveClicked function will be executed if user clicks on image button
document.getElementById('img-btn').addEventListener('click', saveClicked);
}
}
function saveClicked() {
// set a flag in local storage that image button is clicked
localStorage.setItem('img-btn-clicked', 'true');
document.getElementById('img-btn').style.display = 'none'; // hides the img-btn after it gets clicked
}
</script>
</body>