当用户尝试离开而不保存页面时，创建确认JavaScript [英] Create confirm JavaScript for when users try to leave page without saving

问题描述

我正在尝试这样做，以便如果用户对页面进行更改，然后尝试不保存就离开该页面，则会出现带有确定"按钮(没有取消"按钮)的弹出消息.单击确定"按钮，关闭消息.用户必须单击保存"按钮，否则他们将继续收到消息，禁止他们离开页面，直到单击保存"按钮为止.通过离开页面，我的意思是阻止他们导航到站点中的另一个选项卡或菜单项...如果他们单击页面上的任何其他链接，则会为他们提供弹出窗口.他们可以随时离开站点.

I am trying to make it so that if a user makes changes to a page and then tries to leave the page without saving, a popup message will appear with an "OK" button (no "Cancel" button). Clicking the "OK" button, closes the message. The user must click the "Save" button or they will keep getting the message, prohibiting them from leaving the page until the "Save" button is clicked. By leave the page, I mean keeping them from navigating to another tab or menu item within the site...if they click any other link on the page, it would give them the popup. They can leave they site at anytime.

我在想我需要JavaScript模态对话框来摆脱取消"按钮，但是对实现有些不确定.

I am thinking I need JavaScript modal dialog to get rid of the Cancel button but am a bit uncertain of the implementation.

当前，我正在使用r =确认(见下文)，但是它具有取消按钮，如果用户单击确定"，它将为用户提供离开该页面的选项.我不希望他们不单击保存"按钮就可以离开页面，否则他们将不得不关闭整个窗口.

Currently, I am using r = confirm (see below) but it has the cancel button plus it gives the option for users to leave the page if they click "OK". I do not want them to be able to leave the page without clicking the "Save" button or they would have to close the entire window.

非常感谢任何帮助/说明，因为我对此很陌生.谢谢.

Any help/explanation is very much appreciated as I am very new to this. Thank you.

if (typeof unsaved != 'undefined') {
if (unsaved == true) {
var r = confirm("Please click Update. Unsaved changes will be lost.");
if (r == false) {
     saveNeeded = "true";
     }
     else { saveNeeded = "false"; }
 }
}

推荐答案

看看 onBeforeUnload .

您将无法强迫用户停留在网站上，但是当用户试图关闭该窗口时，它将提供一个带有离开"和停留"按钮的弹出窗口.所有主要的网络浏览器都允许用户随意离开任何网页，而您所能做的就是警告他们. onBeforeUnload可能是最好的跨浏览器解决方案，可以使用户有机会留在网站上并在离开前保存所做的更改.

You won't be able to force a user to stay on the website, however it will provide a pop up window with the 'Leave' and 'Stay' buttons when they attempt to close the window. All major web browsers allow the user to leave any webpage at will, and the most you can do is warn them. onBeforeUnload is probably the best cross-browser solution you will achieve to give users a chance to stay on the site and save their changes before leaving.

<script language="JavaScript">
    window.onbeforeunload = confirmExit;
    function confirmExit() {
        return "Please click Update. Unsaved changes will be lost.";
    }
</script>

试图将用户锁定到您的网站而没有离开的选择是非常不好的做法，这就是为什么任何主要的网络浏览器都不支持它的原因.如果必须强制用户执行某项操作非常重要(并且您有权以公司或类似公司的身份)，则应使用其他平台或向用户的Web浏览器编写自定义插件.但是对于一般用途，您无法锁定他们的浏览器.

It would be very bad practice to attempt to lock a user to your website without an option of leaving, which is why it is not supported by any major web browsers. If it is so important that you MUST force the user to do something (and you have the right to as a company or such), you should use another platform or write a custom plugin to the user's web browser. But for general use, you can't lock their browser.

这篇关于当用户尝试离开而不保存页面时，创建确认JavaScript的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！