Question

当用户试图在他/她的项目未保存时尝试离开我的webapp时，我想警告用户。目前，我并不关心目前正在编辑的编辑框。我知道这个项目的会议状态很糟糕。

我很快意识到如果我为window.onbeforeunload设置一个函数，即使他/ sh导航到我的webapp中的另一个页面，它也会打扰用户。在这种情况下不需要干扰，会话将仍然存在。

我尝试了从Fire onbeforeunload only when window is closed (includes working example)

派生的解决方案

window.onbeforeunload = function (e) {
    var targetHost = new URL(e.target.URL).hostname;
    if (targetHost != window.location.host)
        return "Project is unsaved!!!";
    else
        return null;
};

new URL(e.target.URL).hostname会产生JavaScript runtime error: Object doesn't support this action（至少在IE11上）。神秘地说，我找不到任何关于new URL(e.target.URL).hostname的搜索结果。

但与此同时，我希望这不是不可能的，我无法相信别人没有经历过这个。

Answer 1

您的脚本中存在两个问题：

window.onbeforeunload = function (e) {
    var targetHost = new URL(e.target.URL).hostname;
    if (targetHost != window.location.host) {
        return "Project is unsaved!!!";
    else
        return null;
};

首先，您没有关闭if。第二个是IE显然不支持e.target.URL。你需要有一个A和B计划。

计划：适用于e.target.URL存在的情况。在这种情况下，您可以按照最初实现的方式处理案例，但使用上面提到的语法修复。

B计划：适用于e.target.URL不存在的情况。对于这种情况，您应该假设用户离开了站点。当用户使用您的控件进行导航时，您可以通过添加知识来改进方法，例如，您知道给定的锚将保留在站点上。在这种情况下，您可以定义单击事件并将布尔值设置为true（并且该布尔值的默认值应为false ...），以便稍后您的onbeforeunload即使他或她使用IE，事件也会知道您的用户仍留在网站上。

所以你需要一个像这样的逻辑：

var targetHost = !!e.target.URL ? (new URL(e.target.URL).hostname) : ((myFlag) ? (window.location.hostname) : ("elsewhere"));

如何在onbeforeunload事件期间提取目标主机名

1 个答案: