创建基于会话的cookie，jquery [英] create session based cookie, jquery
本文介绍了创建基于会话的cookie，jquery的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
以下代码在页面加载时显示弹出消息，并创建一个cookie，这样当用户返回页面时，他们一次将不会看到弹出消息. Cookie的寿命是基于时间的.我想修改此代码，以便Cookie的寿命基于用户会话或一天.任何指导或代码片段都很棒.谢谢.
the following code displays a pop up message on page load and creates a cookie so that when the user returns to the page they will not see the pop up message once. the cookie's lifespan is based on time. i'd like to modify this code so the cookie's life span is based on the user session or one day. any guidance or code snippets would be great. thanks.
链接到代码演示: http://www.queness .com/post/77/simple-jquery-modal-window-tutorial
<HTML xmlns="http://www.w3.org/1999/xhtml"><HEAD>
<META content="text/html; charset=windows-1252" http-equiv=Content-Type>
<SCRIPT type=text/javascript src="jquery-latest.pack.js"></SCRIPT>
<SCRIPT>
$(document).ready(function() {
//if the cookie hasLaunch is not set, then show the modal window
if (!readCookie('hasLaunch')) {
//launch it
launchWindow('#dialog');
//then set the cookie, so next time the modal won't be displaying again.
createCookie('hasLaunch', 1, 365);
}
//if close button is clicked
$('.window #close').click(function () {
$('#mask').hide();
$('.window').hide();
});
//if mask is clicked
$('#mask').click(function () {
$(this).hide();
$('.window').hide();
});
$(window).resize(function () {
var box = $('#boxes .window');
//Get the screen height and width
var maskHeight = $(document).height();
var maskWidth = $(window).width();
//Set height and width to mask to fill up the whole screen
$('#mask').css({'width':maskWidth,'height':maskHeight});
//Get the window height and width
var winH = $(window).height();
var winW = $(window).width();
//Set the popup window to center
box.css('top', winH/2 - box.height()/2);
box.css('left', winW/2 - box.width()/2);
});
});
function createCookie(name,value,days) {
if (days) {
var date = new Date();
date.setTime(date.getTime()+(days*24*60*60*1000));
var expires = "; expires="+date.toGMTString();
}
else var expires = "";
document.cookie = name+"="+value+expires+"; path=/";
}
function readCookie(name) {
var nameEQ = name + "=";
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(nameEQ) == 0) return c.substring(nameEQ.length,c.length);
}
return null;
}
function launchWindow(id) {
//Get the screen height and width
var maskHeight = $(document).height();
var maskWidth = $(window).width();
//Set heigth and width to mask to fill up the whole screen
$('#mask').css({'width':maskWidth,'height':maskHeight});
//transition effect
$('#mask').fadeIn(1000);
$('#mask').fadeTo("slow",0.8);
//Get the window height and width
var winH = $(window).height();
var winW = $(window).width();
//Set the popup window to center
$(id).css('top', winH/2-$(id).height());
$(id).css('left', winW/2-$(id).width()/2);
//transition effect
$(id).fadeIn(2000);
}
</SCRIPT>
<STYLE>
body {
FONT-FAMILY: verdana; FONT-SIZE: 15px
}
A {
COLOR: #333; TEXT-DECORATION: none
}
A:hover {
COLOR: #ccc; TEXT-DECORATION: none
}
#mask {
Z-INDEX: 9000; POSITION: absolute; BACKGROUND-COLOR: #000; DISPLAY: none; TOP: 0px; LEFT: 0px
}
#boxes .window {
Z-INDEX: 9999; POSITION: fixed; PADDING-BOTTOM: 20px; PADDING-LEFT: 20px; WIDTH: 640px; PADDING-RIGHT: 20px; DISPLAY: none; HEIGHT: 385px; PADDING-TOP: 20px
}
#boxes #dialog {
PADDING-BOTTOM: 10px; BACKGROUND-COLOR: #ffffff; PADDING-LEFT: 10px; WIDTH: 640px; PADDING-RIGHT: 10px; HEIGHT: 385px; PADDING-TOP: 10px
}
.redbox {
color: #F00; font-weight: bold;
}
.bold {
font-weight: bold;
}
</STYLE>
<div id=boxes>
<div id=dialog class=window><span class="redbox"> pop up message <A
href="#" class="bold"> Ok </a> </div>
<div id=mask>
</div></div>
</html>
推荐答案
会话cookie是没有到期时间的cookie，因此请更改此值:
A session cookie is a cookie without an expiration time, so change this:
createCookie('hasLaunch', 1, 365);
收件人:
createCookie('hasLaunch', 1);
这篇关于创建基于会话的cookie，jquery的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
查看全文
