說明:
document.cookie 存入cookie資料
document.cookie=cookie資料名稱=資料;expires=有效期限
此範例設計說明:
第一步、setCookie(資料的名稱, 存放的值, 有效期限天數)如:setCookie("test", "levin", 1);
第二步、設定有效期限
第三步、存入document.cookie=cookie資料名稱=資料;expires=有效期限
第四步、顯示寫入 Cookie 成功頁面上
第五步、取出Cookie的資料,getCookie("名稱")
第六步、取出Cookie資料,依;切割資料
第七步、去掉空白
第八步、比對你的名稱
第九步、取出資料
第十步、顯示資料
程式:
<html>
<head>
<title>[JavaScript-HTML_DOM]使用document物件,使用屬性document.cookie之二</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<script>
function setCookie(pname, pvalue, exdays) {
var d = new Date();
d.setTime(d.getTime() + (exdays * 24 * 60 * 60 * 1000));
var expires = "expires=" + d.toGMTString();
document.cookie = pname + "=" + pvalue + "; " + expires;
document.getElementById("returnData").innerHTML = "寫入 Cookie 成功。";
}
function getCookie(pname) {
var name = pname + "=";
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 "";
}
function mytest() {
setCookie("test", "levin", 1);
var returnData = document.getElementById("returnData").innerHTML;
returnData = returnData + "<br>資料為:" + getCookie("test");
document.getElementById("returnData").innerHTML = returnData;
}
</script>
</head>
<body>
[JavaScript-HTML_DOM]使用document物件,使用屬性document.cookie之二
<br>
<input type="button" value="寫入 Cookie" onclick="mytest();" />
<span id="returnData"></span>
</body>
</html>
圖:
按下測試
相關範例:
待續
參考:
JavaScript Cookies
其它文章
沒有留言:
張貼留言