jquery beforeunload 不显示消息答案

【问题标题】：jquery beforeunload does not display messagejquery beforeunload 不显示消息
【发布时间】：2012-10-25 07:22:00
【问题描述】：

用于此的 jsfiddle 位于 http://jsfiddle.net/whDm6/18/

如果我取消注释以下代码中的警报、更改表单值并刷新页面，它会显示警报。所以我知道代码正在执行到那时。但是，如果我将 Alert 注释掉，它不会像我期望的那样显示 beforeunload 框。

我尝试过使用 bind 并使用基本的 window.onbeforeunload = function() {} 而不用 Jquery 绑定它，但这些都不起作用。

使用 Jquery 1.8.2

var currentUlValues = {};
currentUlValues['input1'] = "red";
currentUlValues['input2'] = "blue";
needToConfirm = true;

$(window).on('beforeunload', function(){
    if (needToConfirm) {
        $.each(currentUlValues, function(key, value) {
            var elem = $("#"+key).val();
            if (typeof elem !== 'undefined') {
                if (elem != currentUlValues[key]) {
                    //alert(elem + " - " + currentUlValues[key]);
                    return 'Are you sure you want to leave?';
                }
            }
        });
    }
});

HTML 表单

<form>
    <input id="input1" name="input1" type="text" value="red" />
    <input id="input2" name="input2" type="text" value="blue" />
</form>

【问题讨论】：

标签： jquery onbeforeunload

【解决方案1】：

你是从.each的回调函数中返回的，它在错误的范围内，你应该返回它之外的字符串。

The working demo:

$(window).on('beforeunload', function(){
    var is_return = false;
    if (needToConfirm) {
        $.each(currentUlValues, function(key, value) {
            var elem = $("#"+key).val();
            if (typeof elem !== 'undefined') {
                if (elem != currentUlValues[key]) {
                    is_return = true;
                    // here return false is to stop the iterate
                    return false;
                }
            }
        });
        if (is_return) {
            return 'Are you sure you want to leave?';
        }
    }
});

【讨论】：

消息不显示

【解决方案2】：

return 正在返回 $.each 匿名函数而不是 beforeunload 函数

【讨论】：

抱歉 - 这只是告诉你问题所在 - 不是解决方案。尝试在 beforeunload function() 的顶部设置一个变量，如果它被 $.each 函数更改，则不返回任何内容

【解决方案3】：

在这里查看答案Dialog box runs for 1 sec and disappears? 短句：

beforeunload 使用浏览器内置的方法，您需要返回一个字符串给它，浏览器将显示该字符串并询问如果用户想离开页面。

您不能使用自己的对话框（或 jQueryUI 模态对话框）来在卸载之前覆盖。

【讨论】：

return '你确定要离开吗？';是一个字符串。

【解决方案4】：

也许你应该使用

return confirm('Are you sure you want to leave?');

【讨论】：