javascript - 以编程方式打开Bootstrap Alert

我正在尝试动态显示引导警报https://getbootstrap.com/docs/4.3/components/alerts/
当用户单击“确定”按钮时，它会显示一条接受cookie的消息，该警告消息应消失，并且在该会话期间不会再次向该用户显示。

不幸的是，我在引导站点上找不到允许以编程方式打开引导警报的文档。因此，每次刷新网站时，都会再次弹出警报。

 <div class="alert fade show cookie-alert" role="alert" data-dismiss="alert">
            <div class="container">
                This website stores cookies. These cookies are used to collect information about how you interact with our website, we use this information to improve and customize your browsing experience. Read our <a target="_blank" href="http://assets.investnow.ng/InvestNow_TC.pdf" style="color:gray;font-weight:bold">terms and conditions</a> to learn more.
                <button type="button" class="btn btn-danger btn-sm pull-right cookie-btn okbtn" data-dismiss="alert" aria-label="Close">OK</button>
            </div>
        </div>

最佳答案

如果用户关闭了cookie警报，则可以存储在localStorage中。

在页面加载时，您将检查是否已设置键，如果未设置，则显示警报：

if (!localStorage.getItem('cookie-alert-dismissed')) {
    $('#cookie-alert').show()
}

然后在用户关闭警报时将其添加：

$('#cookie-alert button').click(function() {
    $('#cookie-alert').hide()
    localStorage.setItem('cookie-alert-dismissed', 1);
});

该密钥将一直保留到用户清空其localStorage或使用其他浏览器为止。