> 웹 프론트엔드 > JS 튜토리얼 > 브라우저 창이 닫히거나 새로 고쳐질 때 JavaScript 코드를 실행하는 방법은 무엇입니까?

브라우저 창이 닫히거나 새로 고쳐질 때 JavaScript 코드를 실행하는 방법은 무엇입니까?

Mary-Kate Olsen
풀어 주다: 2024-11-18 06:38:02
원래의
873명이 탐색했습니다.

How to Execute JavaScript Code When a Browser Window Closes or Refreshes?

창 닫기 또는 페이지 새로 고침 시 JavaScript 코드 실행

웹 애플리케이션으로 작업할 때 사용자가 다음 작업을 수행할 때 특정 코드를 실행하는 것이 중요할 수 있습니다. 브라우저 창을 닫거나 페이지를 새로 고칩니다. 이를 통해 사용자 데이터 저장, 정리 작업 실행 또는 웹사이트 사용 추적과 같은 작업을 수행할 수 있습니다.

창 닫기/코드 실행 새로 고침에 사용 가능한 옵션

다음이 있습니다. 이를 위해 사용할 수 있는 두 가지 기본 JavaScript 이벤트 리스너 목적:

  • window.onbeforeunload: 이 이벤트는 사용자가 창이나 탭을 닫으려고 할 때 트리거됩니다. 사용자에게 확인 대화 상자(예: "페이지를 나가시겠습니까?" 또는 "새로 고침?")를 표시합니다. 그러나 문자열이나 event.returnValue가 반환되지 않으면 메시지를 표시하지 않고 코드가 실행됩니다.
  • window.onunload: 이 이벤트는 창이 닫히거나 페이지가 끝나기 직전에 트리거됩니다. 새로 고침됩니다. onbeforeunload와 달리 사용자에게 확인 대화 상자를 표시하지 않습니다.

이벤트 리스너 사용

다음을 사용하여 이러한 이벤트 리스너를 창 속성에 할당할 수 있습니다. 다음 구문:

window.onbeforeunload = function() {
  // Code to execute on window closure or refresh
};

// OR using addEventListener
window.addEventListener("beforeunload", function(e) {
  // Code to execute on window closure or refresh
});
로그인 후 복사

참고 사항 Iframe

iframe이 상위 항목에 의해 삭제된 경우 beforeunload 이벤트는 iframe 내에서 작동하지 않습니다. 그러나 이 시나리오에서는 Chrome의 언로드 및 페이지 숨기기 이벤트가 작동합니다. 안타깝게도 2023년 8월 현재 Firefox에는 iframe 삭제 시 이러한 이벤트가 작동하지 않는 버그가 있습니다.

위 내용은 브라우저 창이 닫히거나 새로 고쳐질 때 JavaScript 코드를 실행하는 방법은 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

원천:php.cn
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
저자별 최신 기사
인기 튜토리얼
더>
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿