停止页面导航并等待用户确认

Question

我允许用户在表单字段中进行一些更改,并根据用户是否进行了一些更改,启用"提交更改"按钮.

我想添加一个功能,我要求用户确认他想要导航到其他页面而不提交他所做的更改.我添加了代码来显示一个对话框,但问题是对话框显示的时间很短,然后页面导航移动到另一个页面.我的代码是:

        window.onbeforeunload = function() {
            if(!dijit.byId('editBtn').get('disabled')) {
                discardChanges(
                        'Pending Unsaved Changes',
                        'You have pending unsaved changes. Do you really want to discard them?',
                        'Discard Changes',
                        function() {
                            return true;
                        },
                        function() {
                            return false;
                        },
                        300,
                        700);
            }
        }

如何阻止浏览器移动到其他页面并等待用户单击对话框上的按钮,然后确定是否要丢弃单击.对话框如下所示:

Answer 1

使用事件window.onbeforeunload,在卸载页面时触发并返回字符串"您有待处理的未保存更改.您真的要丢弃它们吗？"

Browser显示原生对话框:

这是AFAIK停止导航的唯一方法.

jsFiddle:http://jsfiddle.net/phusick/R6EJ3/show/light/