当用户离开我的网站时显示弹出窗口

Show popup when user navigates away from my website

本文关键字：显示 窗口 网站 用户 离开 我的      更新时间：2023-09-26

我希望每当用户离开我的网站（不仅仅是网页，整个网站）时，都能给他/她一个弹出窗口。

我已经实现了一个方法，但每次离开网页导航时都会弹出。

window.onbeforeunload = function (evt) {

  var message = 'Are you sure you want to navigate away from myWEbSite?';
  if (typeof evt == 'undefined') {
    evt = window.event;
  }
  if (evt ) {
    evt.returnValue = message;
  }
  return message;
 }

您无法获取新的目标url，因为这是受保护的信息（请参阅如何在javascript onbeforeunload事件中获取目标url？）

所以，如果访问者离开了网站，你就看不见了。

替代方案：你可以监听指向另一个网页的超链接上的所有点击，并实现捕获外部链接的功能。

您可以玷污自己的JQuery选择器，如下所示：

$.expr[':'].external = function(obj){
   return !obj.href.match(/^mailto':/) && (obj.hostname != location.hostname);
};
$.expr[':'].internal = function(obj){
   return obj.hostname == location.hostname;
};

然后你可以做以下事情：

$(function() {
    var unloadMessage = function() {
        return "Are you sure you want to navigate away from myWEbSite?";
    };
    $('a:internal').click(function() { 
        window.onbeforeunload = null;
    });
    $('form').submit(function() { 
        window.onbeforeunload = null;
    });
    $('a:external').click(function() { 
        window.onbeforeunload = unloadMessage;
    });
    window.onbeforeunload = unloadMessage;
});

在您的特定情况下，每当单击导航链接或提交内部表单时，您只需要设置window.onbeforeunload == null。

相关文章：