离开站点时显示警告,而不仅仅是页面

Question

这听起来就像呈现给我时几乎不可能做的事情.我知道您可以显示一个对话框,以确认何时离开网页.但离开网站时是否可以显示一个对话框？

我无法找到/创建任何可以读取地址栏并知道您要离开该网站的内容.

Answer 1

首先,定义哪些事件可以让您的用户远离您的网站？

1. 单击您网站内容中的链接
2. 向外部行动提交表格
3. 子窗口中的javascript更改其父级的window.location
4. 用户在搜索栏中开始搜索(FF和IE)
5. 用户在浏览器地址栏中输入搜索/地址.
6. 当用户刚来到您的网站时,用户点击后退按钮(或退格键)
7. 用户在他们离开网站之前点击前进按钮(或shift-backspace)但是通过后退按钮功能返回
8. 用户关闭浏览器窗口

所以.你能做些什么呢？

1. 这很容易.检查您的锚点,如果它们指向外部,请在onclick事件中添加一些功能
2. 与1.类似,onsubmit为您在网站外发布的表单事件添加功能.
3. - > 8.确实没有可以控制的适用解决方案.你可以onbeforeunload随心所欲地滥用事件,但是你不会在知道发生了什么事情上取得太大的成功.并且也存在一些相关的限制onbeforeunload,因此大多数时候你的双手都会受到束缚.

真正的问题？

除非让用户不要离开你,否则你为什么要控制这个事件呢？无论如何,乞讨并不会给网络世界带来太大的正义.当一些网站让我烦恼的消息或更糟糕的是阻止我离开时我不想再回来了.它闻起来糟糕糟糕的可用性,并给出了一些广告软件网站的暗示.

而是通过向用户提供有价值的内容来保持用户的兴趣.

Answer 2

您最好的选择是倾听非标准beforeunload事件.几乎所有的浏览器都支持这一点,期望Opera非常严格地遵守W3C标准.

开球示例:

window.onbeforeunload = function() {
    return "You're leaving the site.";
};

此消息将以确认对话的形式显示.

在您的特定情况下,null只要单击导航链接或提交内部表单,您就需要将其关闭(仅设置为).您可以通过聆听click所需链接的submit事件和所需表单的事件来做到这一点.jQuery在这里可能会有很大的帮助:

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

您只需要为所有外部链接提供defacto标准属性,rel="ext"以表示这些是外部链接.

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