본문 바로가기
프로그래밍/JavaScript

onbeforeunload 닫기 이벤트 처리 ( X 버튼, 새로고침)

by 원피스랜드 2020. 12. 24.
반응형

 

1. 글쓰기 페이지 에서 글쓰고 있는 페이지를 벗어나려고 하는 경우 사용하면 되겠다.

 

크롬 / 파이어폭스 / IE 테스트 결과 다 잘된다.


 window.onbeforeunload = function (e) {

  e = e || window.event;

 

  // For IE<8 and Firefox prior to version 4

  if (e) {

    e.returnValue = '페이지를 닫습니다.';

  }

 

  // For Chrome, Safari, IE8+ and Opera 12+

  return '페이지를 닫습니다.';

};

 

 현재 Firefox는 지정된 메시지를 무시하고, 공통 메시지를 보여준다.

Form Submit 등이 일어날 때도 같은 컨펌창이 뜨므로 Form Submit시에는 onbeforeunload 핸들러를 삭제해야 한다.

$(window).bind('beforeunload', function …

 

 


2. X버튼 이벤트로 사용할 경우 에는 문제점이 있다.

새로고침의 경우에도 해당 이벤트가 발생한다는 점이다.

찾아봤는데 세가지 브라우져에서 완벽하게 구현된 경우는 없다.

대안 으로는 새로고침을 막을수는 있겠다.

 

 

 jquery 사용

 

   // F5, ctrl + F5, ctrl + r 새로고침 막기

    $(document).keydown(function (e) {

            if (e.which === 116) 

            {

                if (typeof event == "object") 

                {

                    event.keyCode = 0;

                }

                return false;

            } 

            else if (e.which === 82 && e.ctrlKey) 

            {

                return false;

            }

    });

 

 

 

반응형

댓글