关闭标签时要求确认

Question

当我在某些浏览器上关闭我的页面时，我想要一个消息框出现并询问我是否真的要关闭页面，有两个按钮，如果我点击No则此选项卡赢了关闭。

我该怎么做？

Answer 1

您需要收听非 - 标准beforeunload事件。几乎所有浏览器都支持这一点，期望Opera能够严格遵守W3C标准。

这是一个启动示例：

window.onbeforeunload = function() {
    return "Hey, you're leaving the site. Bye!";
};

此消息将以确认对话的形式显示。 客户端卸载页面之前，此消息将显示在右侧。这可以是浏览器关闭，但也可以是一个简单的导航操作，如点击链接或在页面中提交表单！

每当点击内部链接或提交内部表单时，您很可能也想将其关闭（仅设置为null）。你不想惹恼那些行为不直观的最终用户。您可以通过聆听所需链接的click事件和所需表单的submit事件来完成此操作。 jQuery在这里可能会有很大的帮助，因为它以交叉浏览器兼容的方式执行，因此您不需要为此编写＆gt; 20行JS代码：

<script src="http://code.jquery.com/jquery-latest.min.js"></script>
<script>
    window.onbeforeunload = function() {
        return "You're leaving the site.";
    };
    $(document).ready(function() {
        $('a[rel!=ext]').click(function() { window.onbeforeunload = null; });
        $('form').submit(function() { window.onbeforeunload = null; });
    });
</script>

您只需要为所有外部链接提供事实上的标准属性rel="ext"，即表示这些是外部链接。

<a href="http://google.com" rel="ext">Google</a>

Answer 2

onbeforeunload在onunload之前开火。

您无法在onunload中取消该活动。 onbeforeunload允许从事件中返回一个字符串（例如window.onbeforeunload = function() {return "really leave now?"}，浏览器会询问用户是否要离开您的页面。如果“是”，则页面没有停止事件的说法点击（这就是我认为的方式。）

一般要点：

• alert，prompt和confirm不允许进行任何一项活动。
• Opera不支持。

警告：至少在IE6 / 7中（可能是IE8但不是FF / Chrome等）{}}和onbeforeunload会在点击锚点/ javascript链接时触发。一些例子：

• onunload
• <a href="#myanchor">trigger unload!</a>

（MSDN和其他任何人一样好，考虑到它是非标准的，并且Firefox / Chrome / Safari似乎在很大程度上已经从IE复制了实现。）

Answer 3

使用onbeforeunload事件

window.onbeforeunload = function(){
    return "Are you sure you want to close the window?";
}

这将显示一个消息框，用户可以选择是否关闭窗口。

请注意，Opera 不支持此功能。