导航到html页面故障安全时，如何检查未保存的更改？

Question

我的Web应用程序具有多个html页面。在给定的页面上（我们将其称为页面A），用户可以对表单进行编辑。当用户导航到我的应用程序中的另一个页面时，当前检查编辑的方法是使用下面的js脚本。

$(window).on('beforeunload', function () {
    if (changes == true) {
        return "this won't show, as the browsers won't show a custom message for security reasons, but is required";
    };
});

当我第一次在应用程序中导航到另一个页面（我们称为页面B）时，此方法就很好了。但是，即使返回上面的函数并且我的变量“ changes”为true，如果我返回到页面A并进行另一轮编辑，浏览器也不会显示您正在导航的警告消息。显然这是因为页面B已被缓存。我认为这是因为，如果我强制重新加载页面B并返回到页面A并导航，浏览器将正确显示警告消息。

什么是更好的解决方案，以确保在浏览到另一个页面时始终警告用户他们正在导航离开未保存更改的页面？

更新：这适用于Chrome，但不适用于Safari。