如果cookie不存在，则接受Javascript/JQuery

Question

我已经创建了一个检查cookie是否存在的脚本。如果是这样的话，它会隐藏一个带有accept button.If的div元素，但是这个cookie并不存在，那么它就会显示这个div。当单击accept按钮时，它会创建cookie。它工作得很好。

我遇到的问题是，当单击运行脚本的页面或刷新页面时，您可以短暂地看到div。这真的很烦人。有人能想出一个解决方案来防止这种情况发生吗？谢谢。

$(document).ready(function () {
    if (/cookie-policy/.test(window.location.href)) {
       $('#cookie').hide();
    }
});
window.onload = function() {
if (document.cookie.indexOf("accept=") >= 0) {
  // They've been here before.
  $('#cookie').hide();
}
else {
    $('html, body').css({overflow: 'hidden', height: 'auto'});
}
};
$(document).ready(function() {
    $('#cookie-close').click(function(cookie) {  
        document.cookie = "accept=cookies accepted; expires=Sun, 18 Dec 2050 12:00:00 UTC";
        $('html, body').css({overflow: 'auto', height: 'auto'});
        $('#cookie').fadeOut("fast");
        return false;
    });
});

Answer 1

我假设你的html中有这样的东西：

<div id="cookie">some content!</div>

您可以将以下内容添加到CSS中：

#cookie {
    display: none;
}

或

<div id="cookie" style="display: none;">content here</div>

这将使div在页面加载时不可见，从而使脚本有时间运行。