window.onbeforeunload

本文介绍了window.onbeforeunload - 仅在不提交表单时显示警告的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！ 问题描述

我正在使用window.onbeforeunload来防止用户在更改表单上的值后导航。这工作正常，除了它还在用户提交表单时显示警告（不需要）。

I am using window.onbeforeunload to prevent the user from navigating away after changing values on a form. This is working fine, except it also shows the warning when the user submits the form (not desired).

如何在表单提交时不显示警告的情况下执行此操作？

How can I do this without showing the warning when the form submits?

当前代码：

var formHasChanged = false; $(document).on('change', 'form.confirm-navigation-form input, form.confirm-navigation-form select, form.confirm-navigation-form textarea', function (e) { formHasChanged = true; }); $(document).ready(function () { window.onbeforeunload = function (e) { if (formHasChanged) { var message = "You have not saved your changes.", e = e || window.event; if (e) { e.returnValue = message; } return message; } } });

推荐答案

使用表单的提交事件设置标志可能有效对你而言。

Using the form's submit event to set a flag might work for you.

var formHasChanged = false; var submitted = false; $(document).on('change', 'form.confirm-navigation-form input, form.confirm-navigation-form select, form.confirm-navigation-form textarea', function (e) { formHasChanged = true; }); $(document).ready(function () { window.onbeforeunload = function (e) { if (formHasChanged && !submitted) { var message = "You have not saved your changes.", e = e || window.event; if (e) { e.returnValue = message; } return message; } } $("form").submit(function() { submitted = true; }); });