如何獲得JavaScript Cookie來記住DIV狀態？

Question

我有一個測試網站here（仍在開發中），並且我試圖在頂部點擊關閉時隱藏頂部的小通知。

目前我的劇本是這樣的：

<style type="text/css"> 
<!-- 
.hide { 
display:none; 
} 
.show { 
display:block; 
} 
--> 
</style> 
<script type="text/javascript"> 
<!-- 
var state; 
window.onload=function() { 
obj=document.getElementById('alert'); 
state=(state==null)?'show':state; 
obj.className=state; 

document.getElementById('close').onclick=function() { 
obj.className=(obj.className=='show')?'hide':'show'; 
state=obj.className; 
setCookie(); 
return false; 
} 
} 

function setCookie() { 
exp=new Date(); 
plusMonth=exp.getTime()+(31*24*60*60*1000); 
exp.setTime(plusMonth); 
document.cookie='State='+state+';expires='+exp.toGMTString(); 
} 

function readCookie() { 
if(document.cookie) { 
state=document.cookie.split('State=')[1]; 
} 
} 
readCookie(); 
//--> 
</script> 

然後：

<div id="alert" class="show" style="float: left; width: 100%;"><div style="width: 80%; text-align:left; float:left;">Sorry for the downtime, we were experiencing some problems with our web host. Everything should be back to normal now =D</div> 
<div style="width: 18%; text-align:right; float:left; padding-right: 20px;"><a href='#' id="close">close</a></div> </div> 

，但它似乎並沒有工作。有任何想法嗎？

在此先感謝！

山姆

Answer 1

首先，你需要修復readCookie，您的通話分裂後會回到一切「狀態=」，這將是存儲在返回數組的第一偏移，所以不是這樣做：

function readCookie() { 
    if(document.cookie) { 
     var tmp = document.cookie.split(';')[0]; 
     state = tmp.split('=')[1]; 
     alert(state); 
    } 
} 

Answer 2

對我來說，它確實有效（Firefox 3.5，Windows XP）。但是div在站點加載完成之前不會消失。您可能首先將div設置爲style="hide"，並在頁面加載後顯示。