Menu
I'm building a fail safe for my form that is going to warn users that if they leave the page their form data will be lost (similar to what gmail does).
window.onbeforeunload = function () { if (formIsDirty) { return "You have unsaved data on this form. Don't leave!"; } } The above function works great in firefox, but in IE it is triggered by any href link, even ones that are links to javascript and not other pages.
for example....
<a href='javascript:someFunction();'>click</a> I'm wondering if there is any way to get around this, as I do not want the user thinking that they are leaving the page when they are simply clicking a button on it. I do not have the option of rewriting all the various links as they are built in and numerous.
Any ideas?
426
The onbeforeunload event occurs when the document is about to be unloaded. This event allows you to display a message in a confirmation dialog box to inform the user whether he/she wants to stay or leave the current page. The default message that appears in the confirmation box, is different in different browsers.
Cancelable: The beforeunload event can be canceled by user interaction: // by https://developer.mozilla.org/en-US/docs/Web/Events/beforeunload#Example window. addEventListener("beforeunload", function(event) { event. preventDefault(); // Cancel the event as stated by the standard.
To prevent a webpage from navigating away using JavaScript, we can set the window. onbeforeunload property to a function that returns any value. window. onbeforeunload = () => { return ""; };
The beforeunload event is fired when the window, the document and its resources are about to be unloaded. The document is still visible and the event is still cancelable at this point. This event enables a web page to trigger a confirmation dialog asking the user if they really want to leave the page.
Note: This only works in Internet Explorer. Note: If the onbeforeunload event is not assigned to the <body> element, you must assign/attach the event on the window object, and use the returnValue property to create a custom message (see syntax examples below). The numbers in the table specify the first browser version that fully supports the event.
The HTML specification states that calls to window.alert (), window.confirm (), and window.prompt () methods may be ignored during this event. See the HTML specification for more details. The beforeunload event suffers from the same problems as the unload event. Especially on mobile, the beforeunload event is not reliably fired.
Execute a JavaScript when the page is about to be unloaded: Definition and Usage. The onbeforeunload event occurs when the document is about to be unloaded. This event allows you to display a message in a confirmation dialog box to inform the user whether he/she wants to stay or leave the current page.
Note: If the onbeforeunload event is not assigned to the <body> element, you must assign/attach the event on the window object, and use the returnValue property to create a custom message (see syntax examples below). The numbers in the table specify the first browser version that fully supports the event.
You may remove and re-assign the onbeforeunload when hovering those links:
jQuery( function($) { //store onbeforeunload for later use $(window).data('beforeunload',window.onbeforeunload); //remove||re-assign onbeforeunload on hover $('a[href^="javascript:"]') .hover( function(){window.onbeforeunload=null;}, function(){window.onbeforeunload=$(window).data('beforeunload');} ); } ); If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
