Programing

자바 스크립트로 팝업을 열고 사용자가 닫을 때 감지 할 수 있습니까?

lottogame 2020. 11. 18. 08:22
반응형

자바 스크립트로 팝업을 열고 사용자가 닫을 때 감지 할 수 있습니까?


질문은 거의 모든 제목에 있습니다.

자바 스크립트로 팝업을 열고 사용자가 닫을 때 감지하는 것이 가능합니까?

프로젝트 내에서 jquery를 사용하고 있으므로 jquery 솔루션이 좋을 것입니다. 건배!


팝업의 내용을 제어 할 수있는 unload경우 여기 에서 창의 이벤트를 처리 하고 opener속성을 통해 원래 창에 알리고 먼저 오프너가 닫혔는지 확인합니다. Opera에서 항상 작동하는 것은 아닙니다.

window.onunload = function() {
    var win = window.opener;
    if (!win.closed) {
        win.someFunctionToCallWhenPopUpCloses();
    }
};

때문에 unload사용자의 페이지에서 멀리 탐색 할 때마다 이벤트가 발생합니다 팝업이 아닌 창을 닫으면 바로 그 때, 팝업 실제로 폐쇄되었는지 확인한다 someFunctionToCallWhenPopUpCloses:

var popUp = window.open("popup.html", "thePopUp", "");
function someFunctionToCallWhenPopUpCloses() {
    window.setTimeout(function() {
        if (popUp.closed) {
            alert("Pop-up definitely closed");
        }
    }, 1);
}

팝업의 내용을 제어 할 수 없거나 대상 브라우저 중 하나가 unload이벤트를 지원하지 않는 경우 기본 창에서 일종의 폴링 솔루션으로 축소됩니다. 간격을 적절하게 조정하십시오.

var win = window.open("popup.html", "thePopUp", "");
var pollTimer = window.setInterval(function() {
    if (win.closed !== false) { // !== is required for compatibility with Opera
        window.clearInterval(pollTimer);
        someFunctionToCallWhenPopUpCloses();
    }
}, 200);

unloadbeforeunload창 이벤트를 살펴보십시오 . 이를 모니터링하면 다음과 같은 방법으로 창이 닫힐 때 DOM이 언로드 될 때 콜백 할 수 있습니다.

var newWin = window.open('/some/url');
newWin.onunload = function(){
  // DOM unloaded, so the window is likely closed.
}

jQuery UI Dialog를 사용할 수 있다면 실제로 close이벤트가 있습니다.


문제에 대한 매우 간단한 해결책이 있습니다.

먼저 다음과 같이 팝업을 열 새 개체를 만듭니다.

var winObj = window.open('http://www.google.com','google','width=800,height=600,status=0,toolbar=0');

이 팝업 창이 언제 닫혔는지 확인하려면 다음과 같은 루프로 계속 확인해야합니다.

var loop = setInterval(function() {   
    if(winObj.closed) {  
        clearInterval(loop);  
        alert('closed');  
    }  
}, 1000); 

이제 경고를 원하는 자바 스크립트 코드로 바꿀 수 있습니다.

즐기세요! :)


새 창 호출을 열려면 :

var wnd = window.open("file.html", "youruniqueid", "width=400, height=300");

창이 닫힐 때를 알고 싶다면을 사용하십시오 onunload.

wnd.onunload = function(){
    // do something
};

닫기 전에 사용자의 확인을 받으려면을 사용하십시오 onbeforeunload.

wnd.onbeforeunload = function(){
    return "are you sure?";
};

우리는 직장 내 프로젝트 중 하나에서 이것을합니다.

트릭은 팝업이 닫힐 때 호출하려는 상위 페이지에 JS 함수를 포함시킨 다음 팝업에서 언로드 이벤트를 연결하는 것입니다.

window.opener속성은이 팝업을 산란 페이지를 말합니다.

예를 들어, callingPageFunction원래 페이지에 이름이 지정된 함수를 작성했다면 다음 과 같이 팝업에서 호출합니다.

$(window).unload(function() {
    window.opener.callingPageFunction()
});

두 가지 참고 사항 :

  1. 이것은 준비된 함수로 래핑되어야합니다.
  2. 거기에 다른 논리를 원할 수 있기 때문에 익명 기능이 있습니다.

예, 팝업 창에 대한 onbeforeUnload 이벤트를 처리 한 다음 다음을 사용하여 부모 창에서 함수를 호출합니다.

window.opener.myFunction()

참고URL : https://stackoverflow.com/questions/3291712/is-it-possible-to-open-a-popup-with-javascript-and-then-detect-when-the-user-clo

반응형