如何制作'您确定要离开此页面吗'浏览器中的警告消息

How to make the 'Are you sure you want to navigate away from this page' warning message in browser?

本文关键字：浏览器 警告 消息 离开 何制作      更新时间：2023-09-26

我有一个网页，其中包含一个文本框和一个提交按钮。当用户编辑文本框中的文本并单击另一个链接（而不是提交按钮）时，我如何显示"您确定要离开此页面吗"弹出消息？

我在网上对此进行了研究，发现了一些javascript示例。这是你能做到的唯一方法吗？如果没有，最好的方法是什么？

这是实现相同的多种方法之一

function goodbye(e) {
    if(!e) e = window.event;
    //e.cancelBubble is supported by IE - this will kill the bubbling process.
    e.cancelBubble = true;
    e.returnValue = 'You sure you want to leave?'; //This is displayed on the dialog
    //e.stopPropagation works in Firefox.
    if (e.stopPropagation) {
        e.stopPropagation();
        e.preventDefault();
    }
}
window.onbeforeunload=goodbye;

从这里获得打开js

只有unload（）事件才能在JS上工作。您无法在服务器上管理它。

查看SO上另一个问题的答案，它与您的问题非常相似

如何显示"；是否确实要离开此页面"何时提交更改？

简单解决方案

    window.onbeforeunload = confirmExit;
    function confirmExit() {
        return "Are you sure you want to leave this page?";
    }

4guysFromRolla.com-在离开页面时提示用户保存

您不能使用onbeforenload窗口方法，因为它是由多种方式触发的，如来回浏览器导航链接、刷新页面、关闭页面、单击链接。

我觉得你必须绑定你想要显示导航离开消息的链接标签，然后使用状态消息显示的功能

 window.addEvent('domready',function(){
         $$('a').addEvent('click', function(e) {
        //leaving(); function u wrote for displaying message
    });
});

function leaving(e) {
    if(!e)
      e = window.event;
//  return code for the displaying message
}

如果您想保证它在几乎所有浏览器上都能工作，请使用JQuery库。下面介绍卸载事件。

http://www.w3schools.com/jquery/event_unload.asp

这完全是为了你的目的。

为了详细说明一下，您必须下载jquery-js库并在项目/页面中引用它，但您可能最终还是想这样做。

如果要从服务器端控制此操作，可以在OnPreRender中动态发出jquery调用。

查看Jquery的.bforeunload属性。这里有一个例子：

$(window).bind('beforeunload', function(){ return 'Click OK to exit'; });

请注意，在卸载之前，由于明显的原因，无法阻止页面卸载或重定向到另一个页面；它太容易被滥用了。此外，如果您只想在卸载前运行一个函数，请尝试以下操作：

$(window).unload(function(){ alert('Bye.'); });

最后，不要忘记在你的head标签中引用jQuery，方法是：

<script src="http://code.jquery.com/jquery-latest.min.js" type="text/javascript"></script>

上面的内容可以让你从互联网上获得最新版本，并省去下载的麻烦，当然你也可以选择这样做，但我只是想让你的东西尽快发挥作用。哦，我还为你找到了一个例子。单击此处查看在函数关闭之前调用该函数的页面。希望这对巴德有所帮助。

我能够使用Andrei G的答案。为了让它在Chrome中运行，我会在他的再见功能的末尾添加这个：

return"；

相关文章：