如何在 HTML 和引导程序 5 中关闭弹出 cookie 模块

问题描述

我需要帮助如何在用户接受或取消时关闭引导程序中的弹出模块。 对于我的生活,我无法弄清楚如何关闭它我似乎忘记了

<div class="cookie-consent"> <span>This site uses cookies to enhance user experience. see<a href="privacy.html" class="ml-1 text-decoration-none"> &nbsp;Privacy policy &nbsp;</a> </span>
    <div class=" ml-2 d-flex align-items-center justify-content-center g-2"> <button class="allow-button mr-1">Allow cookies</button> <button class="allow-button">cancel</button> </div>
</div>

解决方法

我猜你在使用 Bootstrap modals 吗?

您可以将 data-bs-dismiss="modal" 属性添加到您的 button 标签中,是否有效?

,

<script>
function closeCookies() {
  document.getElementById("cookie-div").style="display:none"
}
</script>
<div id="cookie-div" class="cookie-consent"> <span>This site uses cookies to enhance user experience. see<a href="privacy.html" class="ml-1 text-decoration-none"> &nbsp;Privacy policy &nbsp;</a> </span>
    <div class=" ml-2 d-flex align-items-center justify-content-center g-2"> <button onclick="closeCookies()" class="allow-button mr-1">Allow cookies</button> <button class="allow-button" onclick="closeCookies()">cancel</button> </div>
</div>

这有一些 javascript 代码,它定义了一个名为“closeCookies”的函数。此函数获取 id 为“cookie-div”的元素并将显示设置为 none,这意味着 div 中的所有内容也应该消失。该按钮调用了我们刚刚定义的 closeCookies 函数,导致 cookie-consent div 消失。