60. (javascript/자바스크립트) window onbeforeunload 사용해 브라우저 새로 고침 및 종료 이벤트 감지 실시

/* =========================== */

[ 개발 환경 설정 ]

​

개발 툴 : Edit++

개발 언어 : javascript

/* =========================== */

​

/* =========================== */

[소스 코드]

 

    <script>
    	/* 
    	[요약 설명]
    	1. window.onload : html의 로딩이 끝난 후에 시작합니다 (이미지, 영상 등 모두 로드 완료 후 실행됨)    	
    	2. window.onbeforeunload : 브라우저 새로 고침 및 종료 이벤트를 감지합니다
    	*/
    	
    	
    	/* html 최초 로드 및 이벤트 상시 대기 실시 */
    	window.onload = function() {
    		console.log("[window onload] : [start]");
    		console.log("");
    		
    		/* 브라우저 닫기 이벤트 감지 실시 [1]
    		window.addEventListener("beforeunload", function (event) {
    			console.log("[window beforeunload] : [start]");
    			console.log("");        		
        		
    			event.returnValue = "브라우저를 종료하시겠습니까?";    			
    		});    		
    		*/
    	};
    	
    	
    	/* 브라우저 닫기 이벤트 감지 실시 [2] */
    	window.onbeforeunload = function() {
    		console.log("[window onbeforeunload] : [start]");
    		console.log("");
    		
    		return "브라우저를 종료하시겠습니까?";
    	};	    	
    	
    </script>

/* =========================== */

​

/* =========================== */

[결과 출력]

​

/* =========================== */

​

/* =========================== */

[요약 설명]

​

/*

[요약 설명]

1. window.onload : html의 로딩이 끝난 후에 시작합니다 (이미지, 영상 등 모두 로드 완료 후 실행됨)

2. window.onbeforeunload : 브라우저 새로 고침 및 종료 이벤트를 감지합니다

*/

/* =========================== */