我试图在用户第一次访问我的网站时显示一个 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/