javascript - 防止页面离开时弹出 "Confirm Navigation"对话框

Question

似乎这个问题已经被问了很多次，但从未得到解决。

我想防止在离开页面时出现此对话框(附图)。每当我更改此页面上表单中的某些内容时，都会发生警报，​​但表单是异步保存的，因此可以说没有任何更改实际上是“脏”的。

我尝试了在 stackoverflow 和其他网站上找到的一些内容，例如以下内容:

window.onbeforeunload = null;

window.onbeforeunload = function(e) { 
    e.returnValue = '';
    return false;
}

window.onbeforeunload = function(e) { 
    history.go(0);
}

关于如何删除此问题的一些建议将不胜感激。

编辑:根据要求，这里是我正在尝试的代码示例。文件中还有其他代码，但与之无关。

;(function($) {
    // doc ready
    $(function(){
        // Remove the alert
        window.onbeforeunload = null;
    });
})(jQuery);

Answer 1

我为此创建了一个可行的解决方案。

如上所述，我的表单是异步保存的，因此“您可能会丢失更改”警报并不总是准确的。

现在，任何链接点击都不再出现该对话框。但是，这不会检查是否关闭选项卡/浏览器。

;(function($){
    var dontSubmit = false,
        $form = $('form#my-form');

    // Prevent the trigger a false submission on link click
    window.addEventListener("beforeunload", function (e) {
        dontSubmit = true;
        $form.trigger('submit');
    });

    $form.on('submit', function(event){
        if (dontSubmit) {
            event.preventDefault();
            return;
        }

        // Continue on as normal
    });
})(jQuery);