首页
学习
活动
专区
工具
TVP
发布
社区首页 >问答首页 >如何捕获浏览器窗口关闭事件?

如何捕获浏览器窗口关闭事件?
EN

Stack Overflow用户
提问于 2009-10-28 00:15:53
回答 16查看 437.9K关注 0票数 159

我想要捕获浏览器窗口/选项卡关闭事件。我已经在jQuery上尝试过以下几种方式:

jQuery(window).bind(
    "beforeunload", 
    function() { 
        return confirm("Do you really want to close?") 
    }
)

但它也适用于表单提交,这不是我想要的。我想要一个只在用户关闭窗口时触发的事件。

EN

回答 16

Stack Overflow用户

回答已采纳

发布于 2009-10-28 00:22:57

每当用户出于任何原因离开您的页面时,都会触发beforeunload事件。

例如,如果用户提交表单、单击链接、关闭窗口(或选项卡),或者使用地址栏、搜索框或书签转到新页面,都会触发该事件。

您可以使用以下代码排除表单提交和超链接(来自其他框架除外):

var inFormOrLink;
$('a').on('click', function() { inFormOrLink = true; });
$('form').on('submit', function() { inFormOrLink = true; });

$(window).on("beforeunload", function() { 
    return inFormOrLink ? "Do you really want to close?" : null; 
})

对于早于1.7的jQuery版本,请尝试以下操作:

var inFormOrLink;
$('a').live('click', function() { inFormOrLink = true; });
$('form').bind('submit', function() { inFormOrLink = true; });

$(window).bind("beforeunload", function() { 
    return inFormOrLink ? "Do you really want to close?" : null; 
})

live方法不适用于submit事件,因此如果添加新表单,还需要将处理程序绑定到该表单。

请注意,如果另一个事件处理程序取消了提交或导航,则当窗口稍后实际关闭时,您将失去确认提示。您可以通过在submitclick事件中记录时间,并检查beforeunload是否在几秒钟后发生来修复该问题。

票数 223
EN

Stack Overflow用户

发布于 2009-10-28 00:20:58

也许只需在表单的submit事件处理程序中取消绑定beforeunload事件处理程序:

jQuery('form').submit(function() {
    jQuery(window).unbind("beforeunload");
    ...
});
票数 45
EN

Stack Overflow用户

发布于 2012-09-25 23:07:59

对于跨浏览器的解决方案(在Chrome21、IE9、FF15上测试),可以考虑使用以下代码,这是Slaks代码的一个稍微调整的版本:

var inFormOrLink;
$('a').live('click', function() { inFormOrLink = true; });
$('form').bind('submit', function() { inFormOrLink = true; });

$(window).bind('beforeunload', function(eventObject) {
    var returnValue = undefined;
    if (! inFormOrLink) {
        returnValue = "Do you really want to close?";
    }
    eventObject.returnValue = returnValue;
    return returnValue;
}); 

请注意,从Firefox4开始,消息“你真的想关闭吗?”不会显示。FF只显示一条通用消息。请参阅https://developer.mozilla.org/en-US/docs/DOM/window.onbeforeunload中的备注

票数 16
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/1631959

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档