浏览器窗口意外关闭时发出警报

IT技术 javascript jquery
2021-01-19 00:09:02

我有一个聊天应用程序,我希望每当用户意外或手动关闭浏览器时,他都应该收到警报,以便可以执行各种清理操作。我有更多的东西可以在事件之前使用,但我希望将其用于特定网页,因为在加载之前也会调用所有其他网页。请帮忙

4个回答

我们应该防止或提示用户在执行这些操作时他会丢失他的数据。

  1. 单击后退浏览器按钮。
  2. 单击刷新浏览器按钮。
  3. 点击浏览器的关闭按钮。
  4. 单击前进浏览器按钮。
  5. 键盘笔画- Alt+ F4 (关闭)
  6. 键盘敲击- F5(刷新)
  7. 键盘笔画- CTRL+ F5(刷新)
  8. 键盘笔画- Shift+ F5(刷新)
  9. 网址变更
  10. 或者除了您的特定提交按钮之外的任何导致回发的东西。

为了说明我使用了两个文本框,一个是 ID 为 TestButton 的 Asp.net 提交按钮。我采用的其他回发控件是另一个 asp.net 按钮,一个带有 autopostback 属性为 true 的复选框,一个带有 autopostback 属性为 true 的下拉列表。现在我已经使用了所有这些回发控件,以便向您展示我们还需要向用户显示当用户对这些控件执行操作时数据丢失的提示。在提交按钮上,我们不会显示提示,因为我们必须使用该控件操作提交数据。这里是示例代码。我在控件更改时设置了 window.onbeforeunload 方法。

<html >
<head id="Head1">
    <title></title>

    <script type="text/javascript"
            src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>

    <script type="text/javascript">
        $(function()
        {
            // Prevent accidental navigation away
            $(':input').bind(
                'change', function() { setConfirmUnload(true); });
            $('.noprompt-required').click(
                function() { setConfirmUnload(false); });

            function setConfirmUnload(on)
            {
                window.onbeforeunload = on ? unloadMessage : null;
            }
            function unloadMessage()
            {
                return ('You have entered new data on this page. ' +
                        'If you navigate away from this page without ' +
                        'first saving your data, the changes will be lost.');
            }

            window.onerror = UnspecifiedErrorHandler;
            function UnspecifiedErrorHandler()
            {
                return true;
            }

        }); 

    </script>

</head>
<body>
    <form id="form1" name="myForm" runat="server">
    <div>
        First Name :<asp:TextBox ID="TextBox1" runat="server"></asp:TextBox><br />
        <br />
        Last Name :<asp:TextBox ID="TextBox2" runat="server"></asp:TextBox><br />
        <br />
        IsMarried :<asp:CheckBox ID="CheckBox1" runat="server" /><br />
        <br />
        <asp:Button runat="server" ID="TestButton" Text="Submit" CssClass="noprompt-required" /><br />
        <br />
        <br />
        <br />
        <br />
        <asp:Button runat="server" ID="AnotherPostbackButton" Text="AnotherPostbackButton"
             /><br />
        <br />
        <asp:CheckBox runat="server" ID="CheckboxWhichCausePostback" Text="CheckboxWhichCausePostback"
            AutoPostBack="true" /><br />
        <br />
        DropdownWhichCausePostback<asp:DropDownList runat="server" ID="DropdownWhichCausePostback"
            AutoPostBack="true">
            <asp:ListItem Text="Text1"></asp:ListItem>
            <asp:ListItem Text="Text2"></asp:ListItem>
        </asp:DropDownList>
        <br />
        <br />
    </div>
    </form>
</body>

以上我用过:

$('.noprompt-required').click(function() { setConfirmUnload(false); });

我在这一行所做的是我正在调用setConfirmUnload方法并将 false 作为参数传递,这将设置window.onbeforeunload为 null。因此,这意味着在您不希望提示用户的任何控件上,为该控件提供类.noprompt-required并保留其他控件

即使实际提交表单,此解决方案也会触发。它无法使用。
2021-03-26 00:09:02
不工作;该消息将是 Firefox 和 chrome 中的标准消息。它不能被设置,所以省去了额外的麻烦,你需要的只是非常简单的 onbeforeunload 事件处理程序位来返回一些东西。
2021-04-03 00:09:02
这是行不通的。我尝试关闭浏览器的关闭按钮
2021-04-12 00:09:02
我投了这个票,但是......它在 IOS (iPad/iPhone) 中不起作用,这是一个无赖。
2021-04-14 00:09:02

这不是真正的 JQuery 事情,我使用以下功能:

function setConfirmUnload(on) {
    window.onbeforeunload = (on) ? unloadMessage : null;
}

function unloadMessage() {
    return "Are you sure you want to leave this page";
}

然后,您可以随时致电

setConfirmUnload(true) 启用确认或 false 如果您希望允许他们在没有警告的情况下关闭屏幕(例如,如果您有关闭按钮)。

您可以尝试卸载事件:

$(window).unload( function () { alert("Bye now!"); } );

http://docs.jquery.com/Events/unload

我猜这个清理工作只在客户端进行。了解这些“清理”的性质会很有趣。

这将提醒用户,但他们无法返回页面。我认为他的问题中的“意外”一词暗示了 SO 使用的一种警报。
2021-03-18 00:09:02
“了解自然很有趣”确实如此。它们最好不是主机需要的东西,因为无论您可以强制卸载什么样的清理,如果浏览器从任务管理器中被杀死或用户的 PC 崩溃,您将无法捕获它......
2021-03-23 00:09:02
我还暗示可能还需要在服务器上进行一些清理。在任务管理器杀死浏览器的情况下可能会处理的事情。
2021-04-14 00:09:02

你可以用ajax试试这个

$(window).unload( function () { alert("AJAX function to do required job"); } );