关闭标签时要求确认

Question

当我在某些浏览器上关闭我的页面时,我想要一个消息框出现并询问我是否真的要关闭页面,有两个按钮,如果我点击No则该选项卡将不会关闭.

我怎样才能做到这一点？

Answer 1

你要听的非 -标准beforeunload事件.几乎所有的浏览器都支持这一点,期望Opera非常严格地遵守W3C标准.

这是一个启动示例:

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

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

null每当单击内部链接或提交内部表单时,您很可能也希望将其关闭(仅设置为).你不想惹恼那些行为不直观的最终用户.您可以通过聆听click所需链接的submit事件和所需表单的事件来做到这一点.jQuery可能在这里有很大的帮助,因为它以crossbrowser兼容的方式执行,因此您不需要为此编写> 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>

您只需要为所有外部链接提供defacto标准属性,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并且onunload在点击锚点/ javascript链接时会触发.一些例子:

• <a href="#myanchor">trigger unload!</a>
• <a href="javascript: alert('message!')">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不支持此功能.