글 작성 후 저장하지 않고, 브라우저 새로고침, 닫기 또는 다른 페이지로 이동시 주의 메시지를 주는 간단한 스크립트입니다.
예제에서는 subject, message, poster 입력 항목을 확인합니다.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3c.org/TR/xhtml1/DTD/xhtml1-transitiona
l.dtd">
<html xmlns="http://www.w3c.org/1999/xhtml">
<head><title></title>
<script type="text/javascript" language="javascript">
//<![CDATA[
var orig;
var preventUnload = true;
registerEvent(window, 'load', function () {
orig = {
subject : document.getElementById('fm_subject').value,
message : document.getElementById('fm_message').value,
poster : document.getElementById('fm_poster').value
};
});
registerEvent(window, 'beforeunload', function (e) {
if (!e) e = window.event;
curr = {
subject : document.getElementById('fm_subject').value,
message : document.getElementById('fm_message').value,
poster : document.getElementById('fm_poster').value
};
if (preventUnload &&
(curr.subject != orig.subject ||
curr.message != orig.message ||
curr.poster != orig.poster))
{
e.returnValue = "이 페이지를 벗어나면 작성된 내용은 저장되지 않습니다.";
}
});
function registerEvent(obj, ev, handler) {
if (!(obj && ev && handler)) return;
if (obj.addEventListener)
obj.addEventListener(ev, handler, false);
else if (obj.attachEvent)
obj.attachEvent('on'+ev, handler);
}
// 이 함수는사용되지 않습니다. registerEvent() 함수를 작성하면서 같이 작성하였습니다.
function unregisterEvent(obj, ev, handler) {
if (!(obj && ev && handler)) return;
if (obj.removeEventListener) {
try {
obj.removeEventListener(ev, handler, false);
}
catch (e) {};
}
else if (obj.detachEvent) {
try {
obj.detachEvent('on'+ev, handler);
}
catch (e) {};
}
}
function doSubmit () {
preventUnload = false;
// ...
return true;
}
//]]>
</script>
</head>
<body>
<form method="post" onSubmit="return doSubmit()">
<input type="text" id="fm_subject" name="subject" />
<input type="text" id="fm_message" name="message" />
<input type="text" id="fm_poster" name="poster" />
<input type="submit" value="확인" />
</form>
</body>
</html>
----------------------------------------------
나창호@Creative Web Engineering
출처 : PHPSCHOOL
'프로그래밍 > JavaScript' 카테고리의 다른 글
| 아쿠아 메세지 박스 (0) | 2010.04.24 |
|---|---|
| 바코드 라이터 (0) | 2010.04.24 |
| [펌][스크립트] AJAX 자동검색을 간단히 구현해 주는 javascript library (0) | 2010.04.24 |
| [펌][스크립트] 롤링배너객체 Rolling (0) | 2010.04.24 |
| [스크립트] 펌} 스크롤되는 테이블.. (0) | 2010.04.24 |