Alert User on Browser/Tab Close Event [Cross Browser Compatible]
This is how you can alert user on the close of the browser/Tab Close Event..
Create a javascript file by the name check_browser_close.js in the root directory of the folder with the following content:
// JScript File /** * This javascript file checks for the brower/browser tab action. * It is based on the file menstioned by Daniel Melo. * Reference: http://stackoverflow.com/questions/1921941/close-kill-the-session-when-the-browser-or-tab-is-closed */ var validNavigation = false; function wireUpEvents() { /** * For a list of events that triggers onbeforeunload on IE * check http://msdn.microsoft.com/en-us/library/ms536907(VS.85).aspx * * onbeforeunload for IE and chrome * check http://stackoverflow.com/questions/1802930/setting-onbeforeunload-on-body-element-in-chrome-and-ie-using-jquery */ var dont_confirm_leave = 0; //set dont_confirm_leave to 1 when you want the user to be able to leave withou confirmation var leave_message = 'You sure you want to leave?' function goodbye(e) { if (!validNavigation) { if (dont_confirm_leave!==1) { if(!e) e = window.event; //e.cancelBubble is supported by IE - this will kill the bubbling process. e.cancelBubble = true; e.returnValue = leave_message; //e.stopPropagation works in Firefox. if (e.stopPropagation) { e.stopPropagation(); e.preventDefault(); } //return works for Chrome and Safari return leave_message; } } } window.onbeforeunload=goodbye; // Attach the event keypress to exclude the F5 refresh $('document').bind('keypress', function(e) { if (e.keyCode == 116){ validNavigation = true; } }); // Attach the event click for all links in the page $("a").bind("click", function() { validNavigation = true; }); // Attach the event submit for all forms in the page $("form").bind("submit", function() { validNavigation = true; }); // Attach the event click for all inputs in the page $("input[type=submit]").bind("click", function() { validNavigation = true; }); } // Wire up the events as soon as the DOM tree is ready $(document).ready(function() { wireUpEvents(); });
Then Call this file in the page in which you want the alert functionality as follows:
<html xmlns="http://www.w3.org/1999/xhtml" > <head runat="server"> <title>Browser Close</title> <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js"></script> <script type="text/javascript" src="check_browser_close.js"></script> </head> <body> <form id="form1" runat="server"> <div> </div> </form> </body> </html>
No comments:
Post a Comment
Thank You for Your Comments. We will get back to you soon.