Javascript 仅在第一次加载时进行页面覆盖

Javascript 仅在第一次加载时进行页面覆盖,javascript,jquery,html,css,Javascript,Jquery,Html,Css,在我的主页上,我有一个覆盖层,上面有一个按钮可以进入网站。单击后,覆盖将消失。在第一次加载页面时,覆盖应该只显示一次。这是我的问题: 当我第一次进入主页时,会出现覆盖图(应该是这样的) 然后,当我单击导航中的徽标或主菜单项时,主页将重新加载(正常情况下),但覆盖将再次显示(第二次) 当我再次单击徽标或主菜单项(现在是第三次)时,覆盖图将不再显示(应该显示) 我的问题:为什么在我第二次进入页面时会显示覆盖图 这是我的密码: var session = sessionStorage.getItem(

在我的主页上,我有一个覆盖层,上面有一个按钮可以进入网站。单击后,覆盖将消失。在第一次加载页面时,覆盖应该只显示一次。这是我的问题:

  • 当我第一次进入主页时,会出现覆盖图(应该是这样的)
  • 然后,当我单击导航中的徽标或主菜单项时,主页将重新加载(正常情况下),但覆盖将再次显示(第二次)
  • 当我再次单击徽标或主菜单项(现在是第三次)时,覆盖图将不再显示(应该显示) 我的问题:为什么在我第二次进入页面时会显示覆盖图

    这是我的密码:

    var session = sessionStorage.getItem('session');
        console.log(session);
        if (session !== null) {
            $('.overlay').hide();
        }
        sessionStorage.setItem('session', 1);
    

    使用以下代码。当你第一次访问网站时,它设置为24小时只显示一次

        $(document).ready(function(){
                   if ($.cookie('overlay_status') != '1') {
                    setTimeout(function() {
                        $('.overlay').show();
                        $.cookie('overlay_status', '1', { expires: 1}); 
                        }, 20000); 
                    } else {
                     $('.overlay').hide();
    }
        });
    

    这最终似乎对我起了作用

    function setCookie(key, value, expiry) {
        var expires = new Date();
        expires.setTime(expires.getTime() + (expiry * 24 * 60 * 60 * 1000));
        document.cookie = key + '=' + value + ';expires=' + expires.toUTCString();
    }
    
    function getCookie(key) {
        var keyValue = document.cookie.match('(^|;) ?' + key + '=([^;]*)(;|$)');
        return keyValue ? keyValue[2] : null;
    }
    
    function eraseCookie(key) {
        var keyValue = getCookie(key);
        setCookie(key, keyValue, '-1');
    }
    
    if (getCookie('overlay_status') != '1') {
        setTimeout(function () {
            $('.overlay').show();
            setCookie('overlay_status', '1', '1');
        }, 20000);
    } else {
        $('.overlay').hide();
    }
    

    我明白了,您是想在每次新会话处于活动状态时显示覆盖,还是应该在用户登陆页面时只显示一次,然后再也不显示?如果是后者,会话存储将无法完成此任务。当浏览器窗口关闭时,会话结束,然后当他们再次访问时,覆盖将再次出现。尝试使用localStorage进行此操作,或者设置cookie。您需要显示加载覆盖的代码每次新会话处于活动状态时都必须显示覆盖。这对我不起作用,但我想我需要下载插件才能使用此代码?