开云与欧联杯达成官方合作 - 开云(中国)

2年前 (2023-06-13)

本文实例讲述了JS使用cookie实现DIV提示框只显示一次的方法。 同题参见分享给大家供大家参考,具体如下:

这里运用JavaScript的cookie技术,控制网页上的提示DIV只显示一次,也就是当用户是第一次打开网页的时候才显示,第二次自动隐藏起来,很好的提升了用户体验,不会使用户烦感;利用Cookies,我们还可做超多的事情,慢慢体会吧。 对照阅读

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<Meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>cookie,只显示一次的DIV提示框</title>
<style>
.note {
 height: 100px;
 width: 600px;
 background: url(images/tishi.jpg) #FEFFCF 40px 0px no-repeat;
 border: #EDCE7B 1px solid;
}

.guanbi {
 float: right;
 font-size: 12px;
 padding: 6px;
}
</style>
<script>
 function cookiesave(n, v, mins, dn, path) {
 if (n) {
 if (!mins)
 mins = 365 * 24 * 60;
 if (!path)
 path = "/";
 var date = new Date();
 date.setTime(date.getTime() + (mins * 60 * 1000));
 var expires = "; expires=" + date.toGMTString();
 if (dn)
 dn = "domain=" + dn + "; ";
 document.cookie = n + "=" + v + expires + "; " + dn + "path="
 + path;
 }
 }
 function cookieget(n) {
 var name = n + "=";
 var ca = document.cookie.split(';');
 for (var i = 0; i < ca.length; i++) {
 var c = ca[i];
 while (c.charat(0) == ' ')
 c = c.substring(1, c.length);
 if (c.indexOf(name) == 0)
 return c.substring(name.length, c.length);
 }
 return "";
 }
 function closeclick() {
 document.getElementById('note').style.display = 'none';
 cookiesave('closeclick', 'closeclick', '', '', '');
 }
 function clickclose() {
 if (cookieget('closeclick') == 'closeclick') {
 document.getElementById('note').style.display = 'none';
 } else {
 document.getElementById('note').style.display = 'block';
 }
 }
 window.onload = clickclose;
</script>
</head>
<body>
 <div id="note" class="note" style="display: none;">
 <div>
 <a href="#" class="guanbi"><img
 src="images/close-note.gif" border="0" /></a>
 </div>
 </div>
</body>
</html>

原文地址:https://cloud.tencent.com/developer/article/2133650 延伸阅读

你可能想看:

标签:div

继续阅读

若需了解「开云与欧联杯达成官方合作」的上下文,可结合站内栏目与相关篇目交叉阅读。

栏目用于追新,文内链接用于对照细节。两者配合可减少漏读与重复检索。

继续浏览时优先选择同栏目或相近主题,避免被站外镜像带偏。

频道列表

wiki · 科技 · 文化 · div

页面按栏目组织。可先看导读,再进入相关篇目或返回列表。