jquery 有没有可能用javascript打开一个弹出窗口,然后检测用户何时关闭它?

smdnsysy  于 2022-12-18  发布在  jQuery
关注(0)|答案(9)|浏览(143)

问题几乎都在标题里。
是否有可能(以及如何)用javascript打开一个弹出窗口,然后检测用户何时关闭它?
我在项目中使用jquery,所以jquery解决方案会很好。干杯!

6l7fqoea

6l7fqoea1#

如果你可以控制弹出窗口的内容,那么在那里处理窗口的unload事件,并通过opener属性通知原始窗口,首先检查打开窗口的程序是否已经关闭。

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);

k0pti3hp

k0pti3hp2#

你的问题有个很简单的解决办法。
首先创建一个新的对象,它将打开一个弹出窗口,如下所示:

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);

现在你可以用任何你想要的javascript代码替换alert。
玩得开心!:)

uplii1fm

uplii1fm3#

试着查看unloadbeforeunload窗口事件,监视这些事件可以给予您有机会在窗口关闭时DOM卸载时进行回调,如下所示:

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

vi4fp9gy4#

如果可以使用jQuery UI Dialog,它实际上有一个close事件。

xriantvc

xriantvc5#

要打开新窗口,请调用:

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?";
};

o8x7eapl

o8x7eapl6#

我们在我工作的一个项目中做过这个。
诀窍是在父页面中有一个JS函数,您计划在弹出窗口关闭时调用该函数,然后在弹出窗口中挂钩unload事件。
window.opener属性引用产生此弹出窗口的页。
例如,如果我在原始页面上编写了一个名为callingPageFunction的函数,我将从弹出窗口调用它,如下所示:

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

两个注意事项:
1.这应该 Package 在一个ready函数中。
1.我有一个匿名函数因为你可能需要其他的逻辑

2jcobegt

2jcobegt7#

我认为最好的办法是:

const popup = this.window.open(url.toString());
popup.addEventListener('unload', ()=> console.log('closed'))
06odsfpq

06odsfpq8#

是,处理弹出窗口的onbeforeUnload事件,然后使用以下命令调用父窗口上的函数:

window.opener.myFunction()
55ooxyrt

55ooxyrt9#

这对我很有效。onunload事件将在DOM被卸载时触发,例如,如果URL被更改,前一页的DOM被卸载,新页的DOM被加载。

var newWin = window.open('/some/url',"Example");
    
newWin.onunload = function(){
     if(newWin.closed){
       // DOM unloaded and Window Closed.Do what ever you want to do here
     } 
}

相关问题