我有一个聊天应用程序,我希望每当用户不小心或手动关闭浏览器时,他都应该收到警报,以便可以执行各种清理操作。我希望在before事件上使用更多的东西,但我希望将其用于特定的网页,因为所有其他网页也在加载前被调用。请帮忙
我们应防止或提示用户执行这些操作将丢失其数据。
Alt
F4
F5
CTRL
Shift
为了说明我已经使用了两个文本框,一个ID为TestButton的Asp.net提交按钮。我采取的其他回发控件是另一个asp.net按钮,一个具有autopostback属性为true的复选框,一个具有autopostback属性为true的dropdownlist。现在,我已经使用了所有这些回发控件,以便向您展示,当用户在这些控件上执行操作时,我们还需要向用户显示有关数据丢失的提示。在提交按钮上,我们将不会显示提示,因为我们必须通过该控件操作来提交数据。这是示例代码。我在控件更改上设置了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); });
我在这一行中所做的是我正在调用setConfirmUnloadmethod并将false作为参数传递,这将设置window.onbeforeunload为null。因此,这意味着在不希望提示该用户的任何控件上,为该控件提供类,.noprompt- required并保留其他类。
setConfirmUnload
window.onbeforeunload
.noprompt- required