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

Question

我希望在用户尝试离开我的Web应用程序时，如果他/她的项目未保存，可以向其发出警告。目前，我不关心正在编辑的编辑框。我从会话中知道项目的脏状态。

我很快意识到，如果我为window.onbeforeunload设置一个函数，即使他/她在我的Web应用程序内导航到另一个页面，也会干扰用户。在这种情况下，不需要干扰，会话仍将保持活动状态。

我尝试了一个源自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的结果是（至少在IE11上）：

JavaScript运行时错误：对象不支持此操作

我在任何搜索中都找不到有关不存在 new URL(e.target.URL).hostname 的任何信息，这真是神秘。

但同时我希望这不是不可能的，我不相信其他人没有经历过这个问题。

- Csaba Toth

---

我的问题可能很普遍，但实际上这个Web应用程序是一个ASP.NET MVC 5网站。这就是主要使用IE11的方式。 - Csaba Toth

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语句。其次，e.target.URL显然不被IE支持。你需要有A和B两个方案。

A方案：适用于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"));

- Lajos Arpad

---

感谢Lajos提供的指导。我已经更正了if语句，并且会考虑如何引入一个标志。尽管这不能处理某人编辑指向另一个子页面的URL的情况。 - Csaba Toth