用jquery实现层(div)关闭后刷新页面也不显示
想实现一个效果：
点击关闭一个div按钮之后，刷新页面也不会再显示。
搜索了一下google于是有用js代码写的。
曾经以为cookie很难，很神秘，现在有了解了！！
代码如下：
用javascript实现层(div)关闭后刷新页面也不显示: 实现方法: 使用cookie,当用户点击关闭按钮后,会设置相应cookie标记,当在刷新页面的时候检查cookie是否有值,如果有不显示.
<html>
<head>
<meta http-equiv=”Content-Type” content=”text/html; charset=gb2312″ />
<title>用javascript实现层(div)关闭后刷新页面也不显示</title>
<style type=”text/css”>
#myDiv{
border:1px solid red;
background:#cccccc;
width:100px;
height:100px;
}
#mySpan{
cursor:pointer;
}
</style>
<script language=”JavaScript” type=”text/javascript”>
function closeDiv(){
document.getElementById(“myDiv”).style.display = “none”;
document.cookie = “isClose”;
}
window.onload = function(){
var arrStr = document.cookie;
if(arrStr.indexOf(“isClose”) > -1){
closeDiv();
}
}
</script>
</head>
<body>
<div id=”myDiv”><span onclick=”closeDiv()” id=”mySpan”>关闭层</span></div>
</body>
</html>
我测试发现，不行？？我也不知道咋地。后来我就想用jquery实现，于是我再搜jquery cookie
于是就发明了现在我用的
代码如下：
<script>
jQuery.cookie = function(name, value, options) {
if (typeof value != 'undefined') {
options = options || {};
if (value === null) {
value = '';
options = $.extend({}, options);
options.expires = -1;
}
var expires = '';
if (options.expires && (typeof options.expires == 'number' || options.expires.toUTCString)) {
var date;
if (typeof options.expires == 'number') {
date = new Date();
date.setTime(date.getTime() + (options.expires * 24 * 60 * 60 * 1000));//day * 24hour 60min 60sc 1000haomiao
} else {
date = options.expires;
}
expires = '; expires=' + date.toUTCString();
}
var path = options.path ? '; path=' + (options.path) : '';
var domain = options.domain ? '; domain=' + (options.domain) : '';
var secure = options.secure ? '; secure' : '';
document.cookie = [name, '=', encodeURIComponent(value), expires, path, domain, secure].join('');
} else {
var cookieValue = null;
if (document.cookie && document.cookie != '') {
var cookies = document.cookie.split(';');
for (var i = 0; i < cookies.length; i++) {
var cookie = jQuery.trim(cookies[i]);
if (cookie.substring(0, name.length + 1) == (name + '=')) {
cookieValue = decodeURIComponent(cookie.substring(name.length + 1));
break;
}
}
}
return cookieValue;
}
};
var pa=jQuery.noConflict();
pa(document).ready(function(){
var panda =pa(".bottomimg");
panda.children("span").click(function(){
panda.fadeOut(600);
pa.cookie('closediv','close',{ expires: 1});
});
var hc = pa.cookie('closediv');
if(hc=="close")
{panda.hide()
}else{panda.show()}
});
</script>
这是一个jquery插件。我只是自己运用一下而已。我用了一个判断语句
首先点击的时候关闭窗口 ，然后记录cookie 记录cookie 名称为 closediv 值为close 时间为一天
然后判断cookie是否有值==close
然后做相应操作。
有值则隐藏，无值则显示。
然后就ok了。
最后介绍一下操作。
jQuery操作cookie的插件,大概的使用方法如下
$.cookie(‘the_cookie’); //读取Cookie值
$.cookie(‘the_cookie’, ‘the_value’); //设置cookie的值
$.cookie(‘the_cookie’, ‘the_value’, {expires: 7, path: ‘/’, domain: ‘jquery.com’, secure: true});//新建一个cookie 包括有效期 路径 域名等
$.cookie(‘the_cookie’, ‘the_value’); //新建cookie
$.cookie(‘the_cookie’, null); //删除一个cookie
原文链接：http://shanmao.me/web/jquery/yong-jquery-shi-xian-ceng-div-guan-bi-hou-shua-xin-ye-mian-ye-bu-xian-shi
浙公网安备 33010602011771号