[ 팝업 요구사항 ] 1. 웹 사이트 접속시 팝업창이 발생하도록. 2. 팝업창에서 일정기간동안 다시는 팝업창이 발생하지 않도록 처리
[ 어떻게 할까? ] 웹페이지 (index.html) 접속시 팝업(event_pop.html) 이 발생하도록 해 보자.
[index.html ] <head></head> 사이에 다음의 스크립트를 추가하도록 한다.
<script language="javascript"> // 해당이름의 쿠키를 가져온다. function getCookie(cookie_name) { var isCookie = false; var start, end; var i = 0;
// cookie 문자열 전체를 검색 while(i <= document.cookie.length) { start = i; end = start + cookie_name.length; // cookie_name과 동일한 문자가 있다면 if(document.cookie.substring(start, end) == cookie_name) { isCookie = true; break; } i++; }
// cookie_name 문자열을 cookie에서 찾았다면 if(isCookie) { start = end + 1; end = document.cookie.indexOf(";", start); // 마지막 부분이라는 것을 의미(마지막에는 ";"가 없다) if(end < start) end = document.cookie.length; // cookie_name에 해당하는 value값을 추출하여 리턴한다. return document.cookie.substring(start, end); } // 찾지 못했다면 return ""; }
function openMsgBox() { var eventCookie=getCookie("event_condo"); // 쿠키가 없을 경우에만 (다시 보지 않기를 선택하지 않았을 경우.) if (eventCookie != "no") window.open('event_popup.html','_blank','width=350,height=300,top=50,left=150'); } openMsgBox(); // 팝업창을 띄운다. </SCRIPT>
[ event_pop.html ] 팝업창에 추가한다.
<script language="JavaScript"> function setCookie( name, value, expiredays ){ var todayDate = new Date(); todayDate.setDate( todayDate.getDate() + expiredays ); document.cookie = name + "=" + escape( value ) + "; path=/; expires=" + todayDate.toGMTString() + ";"; } function closeWin(){ if ( document.event_Fcondo.event.checked ) setCookie("event_condo", "no" , 1); // 하루 쿠키 적용 ( 마지막 인자값이 날자임 ) } </script>
</HEAD>
<BODY BGCOLOR="#FFFFFF" onunload="closeWin()">
아래의 체크박스에 체크한 후 창을 닫으면 하루동안 창이 열리지 않습니다.
<form name="event_Fcondo"> <input type="checkbox" name="event"><font size=2>오늘하루 이 창을 열지않음</font> <input type=button value="닫기" onclick="self.close()"> </form>
