javascript - 如何设置 cookie 以在第二页加载时隐藏通知栏？

Question

这是我不想要的:

• 一位新用户访问了我的网站。可以看到固定在视口(viewport)底部的通知栏。
• 然后用户点击一个菜单项，转到另一个页面。在第二次页面加载时设置一个 cookie，将通知栏隐藏 60 天(必须 100% 隐藏，并且由于异步加载 javascript 而不会在页面加载时闪烁)。
• 用户也可以点击“确定”按钮关闭通知栏并设置相同的cookie。

这是我的 HTML:

<div id="cookie-message">
    <span>Cookie notice here <a href="#">Read more</a> <a href="#" id="cookie-message-close">Ok</a></span>
</div>

我如何使用 jQuery 做到这一点？

谢谢!

Answer 1

您可以使用 API 来处理 cookie，使事情变得更加简单。

首先，您将 display: none; 放在 div cookie 消息中。

关于是否隐藏通知的逻辑，可以在窗口第一次加载时放一个监听器:

window.addEventListener('load', function(){...});

这样你就可以得到窗口加载的时刻。如果此时没有cookie notice read，则显示div($('#cookie-message').show()，然后设置cookie。如果有已设置的 cookie，您什么都不做。

关于OK点击，在链接中设置一个点击监听器来隐藏通知div($('#cookie-message').show()).

为了帮助你，我做了一个simple example我所说的例子。