这是我需要设置cookie的代码。我是一个身体背景图像更换器,我想设置cookie在x天后到期! 无论是javascript还是jquery cookies!
<script>
$(document).ready(function(){
$("li.one").click( function(){ $
("body").removeClass('bg2 , bg3 , bg4 , bg5 , bg6 , bg7 ,bg8').addClass("bg1");
});
$("li.two").click( function(){ $
("body").removeClass("bg1 , bg3 , bg4 , bg5 , bg6 , bg7 , bg8").addClass("bg2");
});
$("li.three").click( function(){ $
("body").removeClass("bg1 , bg2 , bg4 , bg5 , bg6 , bg7 , bg8").addClass("bg3");
});
$("li.four").click( function(){ $
("body").removeClass('bg1 , bg2 , bg3 , bg5 , bg6 , bg7 , bg8').addClass("bg4");
});
$("li.five").click( function(){ $
("body").removeClass('bg1 , bg2 , bg3 , bg4 , bg6 , bg7 , bg8').addClass("bg5");
});
$("li.six").click( function(){ $
("body").removeClass('bg1 , bg2 , bg3 , bg4 , bg5 , bg7 , bg8').addClass("bg6");
});
$("li.seven").click( function(){ $
("body").removeClass('bg1 , bg2 , bg3 , bg4 , bg5 , bg6 , bg8').addClass("bg7");
});
$("li.eight").click( function(){ $
("body").removeClass('bg1 , bg2 , bg3 , bg4 , bg5 , bg6 , bg7').addClass("bg8");
});
});
</script>
&#13;
<ul id="foxycode-panel_bg_image">
<li class="one"><a href="#"></a></li>
<li class="two"><a href="#"></a></li>
<li class="three"><a href="#"></a></li>
<li class="four"><a href="#"></a></li>
</ul>
................
&#13;
答案 0 :(得分:1)
如果您正在寻找一种方法来设置n天的cookie。您可以使用以下功能:
<script type="text/javascript">
function setCookie(cookieName,cookieValue,nDays) {
var today = new Date();
var expire = new Date();
if (nDays==null || nDays==0) nDays=1;
expire.setTime(today.getTime() + 3600000*24*nDays);
document.cookie = cookieName+"="+escape(cookieValue)+ ";expires="+expire.toGMTString();
}
</script>
and to get the cookie, you can use
<script type="text/javascript">
function getCookie(cname) {
var name = cname + "=";
var ca = document.cookie.split(';');
for(var i=0; i<ca.length; i++) {
var c = ca[i].trim();
if (c.indexOf(name)==0) return c.substring(name.length,c.length);
}
return "";
}
</script>
非常适合我。
答案 1 :(得分:0)
您可以尝试使用jQuery cookie
$(document).ready(function () {
var $lis = $("#foxycode-panel_bg_image li");
var classes = $lis.map(function () {
return $(this).data('class')
}).get()
$lis.click(function () {
$("body").removeClass(classes.join(' ')).addClass($(this).data('class'));
$.cookie('background-class', $(this).data('class'), {
expires: 7
});
});
var clazz = $.cookie('background-class');
if (clazz) {
$("body").addClass(clazz)
}
});
&#13;
.bg1 {
background-color: #ff0000;
}
.bg2 {
background-color: #00ff00;
}
.bg3 {
background-color: #0000ff;
}
.bg4 {
background-color: #0ffff0;
}
&#13;
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/jquery-cookie/1.4.1/jquery.cookie.min.js"></script>
<ul id="foxycode-panel_bg_image">
<li class="one" data-class="bg1"><a href="#">bg1</a></li>
<li class="two" data-class="bg2"><a href="#">bg2</a></li>
<li class="three" data-class="bg3"><a href="#">bg3</a></li>
<li class="four" data-class="bg4"><a href="#">bg4</a></li>
</ul>
&#13;
演示:Fiddle