窗口 beforeunload 在 jquery 中没有按预期工作

Question

基本上我想做的是，每当用户尝试关闭当前选项卡时（当他在我的网站上时），我想显示一个弹出窗口，其中包含三个关于他离开的原因并想要存储的选项选择一些地方

所以我在main.js 中写了以下内容，这些内容将通过整个网站页面加载

$(document).ready(function() {
  // Before closing the current tab, ask user for a reason
    $(window).on('beforeunload', function(event){
      $('#load_choices_up').click();
      event.stopPropagation();
      event.preventDefault();
      debugger;
    });
});

所以我对上面的 jquery 代码有三个问题

*.即使我单击同一页面上的另一个链接（我的意思是如果我从当前页面导航到另一个页面），此代码仍在执行，但我只希望此代码在 当前选项卡/页面时运行 已完全关闭（即将关闭），但在导航到我网站上的另一个页面时没有

*。在这行$('#load_choices_up').click() 执行后，一个选项弹出按预期打开，但浏览器的默认处理（即关闭功能）并没有被两行event.stopPropagation(); 和event.preventDefault(); 停止，我的意思是这两行停止行为的方法不起作用并且浏览器已关闭，但我想根据用户选择输入进行一些处理，然后基于此我将关闭选项卡。

*。当我使用return "Why do you want to leave the page" 时，浏览器不会弹出选择，而是根据浏览器类型显示不同的消息，例如 chrome 中的“您有未保存的更改”，以及 Firefox 中的一些不同消息，而不是显示我的自定义消息

最后，为什么 event.stopPropagation(); 和 event.preventDefault(); 不起作用？以及为什么我无法显示我的自定义消息？

Answer 1

您无法阻止某人关闭浏览器。这是出于明显的安全原因。想象一下，一个垃圾邮件网站阻止您关闭网站，同时让您充满天知道。

您最多可以提取一个函数，例如 alert() 或 prompt。用户关闭它们后，选项卡将以任何一种方式关闭。

beforeUnload 的时间也非常短。您将无法使用它运行大量脚本，因为用户可能会在任何脚本正常运行之前关闭水龙头。 （我用ajax调用试过了，没用）

因此，即使您能够在其中获得所需的选项，一旦用户选择其中一个选项，您也无法将其保存在任何地方。你的脚本永远不会走那么远。

您可以自定义“您确定吗？”像这样的消息：

$(document).ready(function() {
    window.onbeforeunload = function(e) {
       return 'Dialog text here.';
    };
});

但同样，您只能更改文本。它是浏览器的本机功能，您无法更改它。