javascript - 未保存的更改警告弹出窗口

我正在尝试在Web应用程序中实现“未保存的更改”警告，但我正努力使其正常工作。我知道javascript中存在onbeforeunload事件，但是我被要求使用带有一些特殊格式的自定义div作为模式弹出窗口来提示用户有关那些未保存的更改。

到目前为止，我得到的是:

基本上，它的作用是绑定(bind)一个函数，该函数将检查页面是否肮脏，并在单击任何可能导致回发的链接或按钮等之前，提示用户弹出窗口。我现在遇到的问题之一是，当我按继续时，所有取消的事件似乎都在运行，而不仅仅是最后一个。

我知道这不是最好的解决方案，但这是我唯一想到的事情。欢迎有更好的主意:)

jQuery函数在所有其他事件之前绑定(bind)事件:

$.fn.bindFirst = function(name, fn) {
    this.bind(name, fn);
    var handlers = this.data('events')[name.split('.')[0]];
    if (handlers.length) {
        var handler = handlers.pop();
        handlers.splice(0, 0, handler);
    }
};

function hideSaveWarning() {
    $("#divSaveWarning").hide();
}

这将设置继续按钮以执行已取消的操作

function showSaveWarning(e) {
    $("#divSaveWarning").show();
    $("[id$='_btnContinue']").click(function() {
        e.currentTarget.click();
    });
}

function onClickContinueWithoutSaving() {
    hideSaveWarning();
    setDirtyContent(false);
}

function SetSavePrompt() {
    setDirtyContent(false);
    $(":input, :radio, :button, a").not("[id$='_btnSave']").bindFirst('click', function(e) {
        if (isPageDirty) {
            showSaveWarning(e);
            return false;
        }
    });
}

谢谢。
问候。

最佳答案

这会成功吗？

http://mal.co.nz/code/jquery-dirty-forms/