javascript - 如果未提交表单，则触发 onbeforeunload

Question

我有一个通过 PHP 使用 3 个提交操作提交的表单:

• 保存并继续
• 保存并退出
• 不保存退出

如果用户没有点击任何表单操作来通知他们他们正在离开页面，并且他们的更改可能不会被保存，我想触发一个“OnBeforeUnload”警报来显示。

我尝试了以下代码，但似乎在我的点击事件之前触发了 unbeforeunload。关于如何最好地实现这一点有什么建议吗？

$buttonpressed = false;
$j(".Actions input").click(function(){
    $buttonpressed = true;                                  
});

if(!$buttonpressed){
    window.onbeforeunload = function(){
        return "Your changes may not be saved.";
    }
}

Answer 1

您需要在处理程序内部进行检查，如下所示:

window.onbeforeunload = function(){
    if(!$buttonpressed){
        return "Your changes may not be saved.";
    }
}

当前它在您的代码运行时绑定(bind) window.onbeforeunload 因为 $buttonpressed 在运行时是 false...它不会因为您已经绑定(bind)了处理程序，所以它以后是否会更改很重要。另一种方法是使其更简单一些，如下所示:

window.onbeforeunload = function(){
    return "Your changes may not be saved.";
}
$j(".Actions input").click(function(){
    window.onbeforeunload = null;
});

这只会删除 click 上的处理程序。处理其他提交情况的更合适的事件是附加到 submit 事件，如下所示:

$j(".myForm").submit(function(){
    window.onbeforeunload = null;
});