Question

我有一个很长的调查，我想阻止用户点击后退按钮并丢失所有数据。到目前为止，我有一个警告告诉他们他们将丢失所有数据但是当他们提交表单来处理页面时，它会弹出警报。有没有办法只有当他们按下提交按钮时才能禁用警报？这是我用来创建警报的方法：

window.onbeforeunload = function() { return "Your work will be lost."; };

Answer 1

您可以通过以下方式设置 beforeunload 侦听器：

var preventUser = function() {
    return "Your work will be lost";
}
window.addEventListener('beforeunload',preventUser);

然后，当用户提交表单时，您可以通过以下方式删除监听器：

function onSubmitForm(){
    window.removeEventListener('beforeunload',preventUser);
}

例如：

<button onclick="onSubmitForm()">Submit Form</button>

Answer 2

我认为你必须写下这个功能，'function（）{return“你的工作将会丢失。”; };”在你的后退按钮的onClick事件中。并删除该行'window.onbeforeunload = function（）{return“你的工作将会丢失。”; };”。我认为，它会正常工作......

Answer 3

除了浏览器的按钮点击之外，即使在常规标签页或链接点击上，也会触发

window.onbeforeunload。我没有找到浏览器后退或前进点击专用的触发器。

Answer 4

尝试了许多复杂的方法后，我得到了这个解决方案。

    window.onbeforeunload = function () {
        return 'Are you sure? Your work will be lost.';
    };

    $(document).on("submit", "form", function () {
        window.onbeforeunload = null;
    });

添加了用户单击后退按钮时的警报，但现在我想在提交表单时将其删除

4 个答案: