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.";
    }
}

目前它window.onbeforeunload在您的代码运行时绑定，因为$buttonpressed它false在运行时......它是否稍后更改并不重要，因为您已经绑定了处理程序。另一种方法是让它更简单一些，如下所示：

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;
});