[JavaScript] 부모창이 닫힐 때 함께 닫히는 종속 자식창

[JavaScript] 부모창이 닫힐 때 함께 닫히는 종속 자식창

  오후 2:57    홍다슬

---

Laptop

운영체제	Windows 10 Pro 64bit
개발환경	Chrome 버전 78.0.3904.108

window.open으로 여는 팝업에서 부모창이 종료될 때 그 부모창에서 열었던 팝업들을 함께 닫아야 하는 경우가 있다.
원래는 dependent라는 옵션이 있었지만, 구버전에서만 지원하는듯 했다.

방법은 window.onunload 이벤트를 이용하는 것이다.
window.load 이벤트와 반대로 페이지가 종료될 때 함께 실행되는 함수라고 보면 된다.
다음 예제에서는 pop 이라는 전역변수를 선언한 뒤 버튼을 클릭할 때 객체를 리턴받고,
onunload 시 pop을 닫아 열렸던 팝업을 닫아준다.

<script>
var pop;
window.onunload = function() { pop.close(); }
</script>
<input onclick="pop = window.open('', '_blank', 'dialog,width=320,height=150,scrollbars=0'); " type="button" value="팝업" />

결과는 현재 이 글에 적용되어 있다.
아래 버튼을 누르면 작은 빈 창이 뜰텐데, 이 페이지를 닫거나 새로고침, 뒤로가기 해보면 함께 닫히는 것을 볼 수 있다.




- 참고 사이트: https://stackoverflow.com/questions/33523873/close-child-window-on-f5-refresh