index.html
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN""http://www.w3.org/TR/html4/loose.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>New Web Project</title>
<script language="JavaScript">
function init(){
// alert("쿠키 데이터 읽어오기 : " + getCookie('name')+" / "+getCookie('id')+" / "+getCookie('comments')+" / "+getCookie('job')+" / "+getCookie('chk_info'));
document.getElementById("divname").innerHTML = "이름 : "+getCookie('name');
document.getElementById("divid").innerHTML = "아이디 : "+getCookie('id');
document.getElementById("divcomments").innerHTML = "내용 : "+getCookie('comments');
document.getElementById("divjob").innerHTML = "목차 : "+getCookie('job');
document.getElementById("divchk").innerHTML = "차시 : "+getCookie('chk_info');
if(getCookie('chk_info') == ""){
document.all.layer_1.style.display = ""; //가입 폼 "none" 으로 하면 안보임
}
else{
document.all.layer_2.style.display = ""; //쿠키 데이터 출력폼
}
}
// 쿠키 가져오기
function getCookie(cName) {
cName = cName + '=';
var cookieData = document.cookie;
var start = cookieData.indexOf(cName);
var cValue = '';
if(start != -1){
start += cName.length;
var end = cookieData.indexOf(';', start);
if(end == -1)end = cookieData.length;
cValue = cookieData.substring(start, end);
}
return unescape(cValue);
}
function deleteCookie(){
setCookie('name', '', -1);
setCookie('id', '', -1);
setCookie('comments', '', -1);
setCookie('job', '', -1);
setCookie('chk_info', '', -1);
}
function setCookie(cName, cValue, cDay){
var expire = new Date();
expire.setDate(expire.getDate() + cDay);
cookies = cName + '=' + escape(cValue) + '; path=/ '; // 한글 깨짐을 막기위해 escape(cValue)를 합니다.
if(typeof cDay != 'undefined') cookies += ';expires=' + expire.toGMTString() + ';';
document.cookie = cookies;
}
</script>
</head>
<body onLoad="init();">
<div id="layer_1" style="display:none">
<h1>쿠키 입력</h1>
<form method=get action="cookie.html">
이름 : <input type="text" name="name" id="name" value=""/> <br/><br/>
아이디 : <input type="text" name="id" id="id" value=""/> <br/><br/>
내용 : <textarea name="comments" id="comments" cols="25" rows="3"></textarea><br/><br/>
<select name="job">
<option value="">목차</option>
<option value="챕터1">챕터1</option>
<option value="챕터2">챕터2</option>
<option value="챕터3">챕터3</option>
</select><br/><br/>
차시 :
<input type="radio" name="chk_info" value="1차" checked="checked">1차
<input type="radio" name="chk_info" value="2차">2차
<input type="radio" name="chk_info" value="3차">3차 <br/><br/>
<br/>
<input type="submit" value="submit">
</from>
</div>
<input type="button" value="쿠키 삭제" onclick="deleteCookie()">
<div id="layer_2" style="display:none">
<br/>
<div id="divname"></div><br/>
<div id="divid"></div><br/>
<div id="divcomments"></div><br/>
<div id="divjob"></div><br/>
<div id="divchk"></div>
</div>
</body>
</html>
cookie.html
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN""http://www.w3.org/TR/html4/loose.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>New Web Project</title>
<script language="JavaScript">
function init(){
//쿠키 저장 하기
setCookie("name", getParam("name"), 1);
setCookie("id", getParam("id"), 1);
setCookie("comments", getParam("comments"), 1);
setCookie("job", getParam("job"), 1);
setCookie("chk_info", getParam("chk_info"), 1);
setTimeout("back()", 1000); //페이지에 1초의 딜레이를 줌
}
function back(){
history.back(-1)
}
//http://stove99.tistory.com/97 참고한 블로그
// 파라메터 정보가 저장될 오브젝트
// common.js 같은 모든 페이지에서 로딩되는 js 파일에 넣어두면 됨.
var getParam = function(key){
var _parammap = {};
document.location.search.replace(/\??(?:([^=]+)=([^&]*)&?)/g, function () {
function decode(s) {
return decodeURIComponent(s.split("+").join(" "));
}
_parammap[decode(arguments[1])] = decode(arguments[2]);
});
return _parammap[key];
};
// alert("파라미터 값 확인 : " + getParam("name") +" / "+getParam("id")+" / "+getParam("comments")+" / "+getParam("job")+" / "+getParam("chk_info")); //파라미터값 출력
//쿠키 저장
//http://www.superkts.pe.kr/helper/view.php?seq=263&PHPSESSID=cdf657ead7ae8cc1489d107afa893f49 참고한 블로그
function setCookie(cName, cValue, cDay){
var expire = new Date();
expire.setDate(expire.getDate() + cDay);
cookies = cName + '=' + escape(cValue) + '; path=/ '; // 한글 깨짐을 막기위해 escape(cValue)를 합니다.
if(typeof cDay != 'undefined') cookies += ';expires=' + expire.toGMTString() + ';';
document.cookie = cookies;
}
</script>
</head>
<body onLoad="init();">
<h1>쿠키 저장 페이지</h1>
저장 되었습니다.
</body>
</html>
cookieTest.zip
