javascript - 仅在第一次访问时显示 div(cookies?)

标签 javascript html cookies

我试图在用户第一次访问我的网站时显示一个 div。我很确定我是通过使用 cookie 来做到这一点的,我对它的经验有限,而且很难理解。我在网上找到的大多数教程只谈论让 cookie 提示用户输入名称之类的东西,并让它稍后再记忆起来,这根本不是我想要的。我只是想让 cookie 检查用户以前是否访问过我的站点,如果没有,则显示一个通常隐藏的 div。

这是我尝试过但未能开始工作的东西。

HTML:

<head>
   <script type="text/javascript" src="annoy.js"></script>
   <script type="text/javascript" src="scripts.js"></script>
</head>

...
<body>
    <div id="overbox3">
         <div id="infobox3">
              <p>This is the cookie box</p>
              <br />
              <p>it should only show once </p>
              <br/><br/>
         </div><!-- end infobox3 --> 
    </div> <!-- end overbox3 -->
</body>

CSS(不太相关,因为它工作正常):

#overbox3 {
         position: fixed;
         top: 0px;
         left: 0px;
         width: 100%;
         height: 100%; 
         background: rgba(64, 64, 64, 0.5);
         z-index: 999999;
         display: none;
    }

    #infobox3 {
        margin: auto;
        position: absolute;
        left: 35%;
        top: 20%;
        height: 300px;
         width: 400px;
        background-color: white;
        border: 1px solid red;
    }

scripts.js相关内容:

function popbox3() {
    $('#overbox3').toggle();
}

我假设的问题是 annoy.js 的内容:

    function GetCookie(name) {
        var arg=name+"=";
        var alen=arg.length;
        var clen=document.cookie.length;
        var i=0;

        while (i<clen) {
            var j=i+alen;
                if (document.cookie.substring(i,j)==arg)
                    return "here";
                i=document.cookie.indexOf(" ",i)+1;
                if (i==0) 
                    break;
        }

        return null;
    }

    var visit=GetCookie("COOKIE1");

    if (visit==null){
    var expire=new Date();

    popbox3();

    expire=new Date(expire.getTime()+7776000000);
    document.cookie="COOKIE1=here; expires="+expire;
}

根据我的理解,cookie 应该仅在用户未访问时调用函数 popbox3(),这将切换隐藏 div 的显示。但截至目前,没有任何效果。此处的任何澄清或帮助将不胜感激。提前致谢。

最佳答案

您的 cookie 代码看起来不错。您需要在文档就绪处理程序中运行它,以便在切换 DIV 之前等待文档加载:

$(function() {
    var visit=GetCookie("COOKIE1");

    if (visit==null){
        popbox3();
    }
    var expire=new Date();
    expire=new Date(expire.getTime()+7776000000);
    document.cookie="COOKIE1=here; expires="+expire;
}

我还设置了无条件的 cookie,这样每次访问网站都会推迟过期时间。

关于javascript - 仅在第一次访问时显示 div(cookies?),我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/18904697/

相关文章:

javascript - 在javascript settimeout中依次调用两个函数

html - 固定 parent 后面的 child

html - 我怎样才能使这个按钮中的文字靠得更近?

javascript - 带有 ID 列表的 Prisma deleteMany

javascript - 如何将焦点设置为独立于 id 的 HTML 表单中的第一个输入元素?

javascript - Cordova 是否支持 PHP 代码

java - 忽略 Tomcat 中特定 URI 的 cookie

javascript - Chrome 扩展 : grab all cross domain cookies under the url tab?

cookies - 跟踪代码管理器 - 添加基于 cookie 值的触发器触发异常

javascript - 如何将复选框绑定(bind)到值的倒数?