그러냐

window.open() 새 창 닫힐 때 이벤트 본문

jquery

window.open() 새 창 닫힐 때 이벤트

관절분리 2021. 6. 10. 14:55
반응형

parent(부모창, opener) 와 children(자식창, popup)에서 자식창이 닫혔을 경우에

부모창에서 그 이벤트를 캐치하기보다는 자식창에서 창을 닫기 전에 

부모창을에 callback 해주는 것이 명확하다.( ex. opener.form.name.value = '값', opener.test() 등)

 

 

1
2
3
4
5
6
7
8
9
var popObj = window.open("url","name",...);        
var timer = setInterval(function() { 
   if(popObj.closed) {
       clearInterval(timer);


        // TODO:코드


   }
}, 1000);
Colored by Color Scripter
cs

 

부모창이 계속 자식창을 감시하고 있다.

 

 

 

브라우저에게 귀찮게 안하려고 바인딩으로 하였지만..

 

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
var popObj = window.open("url","name",...);        
$(popObj).load(function(){


    $(popObj).unload(function(){
        
        if(popObj.closed){    // 닫기한 경우 - 윈도우창 닫기, self.close() 


            // TODO : code


        }else{    // 기타


            // TODO : code
        }
        
    });


});
Colored by Color Scripter
cs

 

 

최초 로딩시에 닫기를 하면 잘된다.

방법을 찾았다 싶었지만 새로운 문제가..

 

문제는 기타의 경우(참고 : https://www.w3schools.com/jquery/event_unload.asp)

jQuery unload() Method

jQuery unload() Method ❮ jQuery Event Methods Example Alert a message when navigating away from the page: $(window).unload(function(){ alert("Goodbye!"); }); Try it Yourself » Definition and Usage The unload() method was deprecated in jQuery version 1.8 and removed in version 3.0. The unload eve...

www.w3schools.com

다른 링크이동, 새로운 URL, 앞(뒤)로가기, 새로고침일 경우에는 

else 구문으로 받을 수 있지만

특히 새로고침(다른 경우는 테스트 못해봄)에는 최초 바인딩이 풀려버려서 안된다.

자식창은 따로 분리된 것이므로 한번의 바인딩으론 잘 되지 않는다..

 

(재귀 호출로 해봤지만 되지 않더라.. 새로고침한 객체를 return 받을 수도 없고..

else 부분의 scope가 아직 끝나지 않아서 새로고침한 객체또한 아니다..)

 

게다가 키보드의 단축키(Ctrl+W)로 브라우저 창을 닫아도 else 부분이다.

 

jQuery.unload 가 아닌

pure javascript 의

 window.onunload = function () {

 // callback

}

 

으로하면 윈도우 창이 닫히는 이벤트가 catch 된다

 

 

 

출처  :  https://m.blog.naver.com/PostView.naver?isHttpsRedirect=true&blogId=reilove333&logNo=221134656195 

 

window.open 새창 닫혔을 때 parent 이벤트 발생

parent(부모창, opener) 와 children(자식창, popup)에서 자식창이 닫혔을 경우에 부모창에서 그 이벤트를 ...

blog.naver.com

 

반응형