Why is jQuery unload not working in chrome and safari? - javascript

unload function in jQuery works fine in Firefox but not in chrome and safari. please check this fiddle in chrome and Firefox. http://jsfiddle.net/jeevankk/Gywnw/2/ . Alerts a message when the page is refreshed.
$(window).unload(function() {
alert("Unload");
});​

This should work to show a confirmation when the users leaves, this is also not part of any standard.
$(window).on('beforeunload ',function() {
return 'Are you sure ?';
});

I found Joseph's comment as the correct answer, So posting this answer.
Dialogs are blocked/prevented during "beforeunload" (with exception to the beforeunload prompt) and "unload" events. Can be confirmed by checking your console.

This is because the unload event is not part of any standard
https://developer.mozilla.org/en/DOM/window.onunload
check the bottom of the page i just linked to.

jQuery's unload works well in chrome too, with the exception that Chrome doesn't allow alerts within it. I've used it to set cookies. And if it works with Chrome hope it works in Safari too.

the unload function of jquery has some problem with browsers..refer the following link
http://bugs.jquery.com/ticket/5538
can you elaborate on the problem so that we can find some work around??

you can use onfocusout on the body .. but i wouldn't recommend if you are trying to use something like an alert, on this operation, asking the user not to leave your page ..

"refresh" action in the Firefox does not fire the unload event.
We should use onbeforeunload instead.
Confirm with Firefox version 47, Mac OS X

Related

Check if user is leaving the page js

I tried onbeforeunload event but it's not working when leaving the page it's only working when I reload but every thing works fine on edge.
I think Chrome have changed somethings in configuration.
Is there a way to fix that or another method?
onbeforeunload = function(){
return("bye");
}
AND is there a way I can check if user is closing the page or redirecting to another url with out firing on reloading or can I not do that?
Even when using JQuery, a framework with the objective cross browser compatibility, they say:
The exact handling of the unload event has varied from version to version of browsers. For example, some versions of Firefox trigger the event when a link is followed, but not when the window is closed. In practical usage, behavior should be tested on all supported browsers and contrasted with the similar beforeunload event.
Source
So you have to accept an inconsistent behaviour.
You could try doing this:
window.onbeforeunload = function(e) {
return "Bye";
}
As you need to attach the event to the window

How to use JS detect user close page on Safari

I want to detect user close my page using js, in Chrome/Firefox I use onbeforeunload event, but in Safari (on macOS and iOS) it doesn't work (but MDN say It work...)
In Safari on macOS, onbeforeunload only work first time refresh/close page.
I try unload, beforeunload, pagehide also not work.
Please try the following.
window.unload = function ()
{
// add code here
};
Here is some documentation https://www.w3.org/TR/DOM-Level-2-Events/events.html

button click javascript not running on iPad/iPhone safari

Hello I was reading up on this problem and people had mentioned that to get click to run on safari and chome you needed to have the code set up like so
$('input[type=submit]#btnIsAddress').bind('click', function (event) {
alert("this is code");
selectAddress(event);
event.preventDefault();
return false;
});
This code works on all browsers on a desktop and will work on Chrome, Dolphin and Mercury on an iPad but it will not work on safari on an iPad (go figure the most used one...) Instead it will treat the button as if its just text, it doesn't even try to run someone or give me the little click animation when pressed.
However I have noticed that if I let the iPad go to sleep mode while on the page then turn the iPad back on the button will work with no problem.
Has anyone else run into this sort of problem before? I'm guessing its something to do with my javascript but it seems like pretty simple script...
We don't see the entire context. If you're button is dynamically added to the DOM then did you try using .live() instead of .bind() ?
.live() is still available in jquery 1.4.3.
.on() for jquery 1.11

IE9 Window Loses Focus due to jQuery Mobile

In our product, we're using the most recent development version of jQuery Mobile in our ASP.NET website. Each and every time we do an ASP.NET postback, the browser window goes to the back of the screen.
Example:
Maximize any window. Example: Visual
Studio, Word, Windows Explorer.
Maximize IE9 over it. IE9 is the only
thing you see on the screen.
Click on a button in our solution that does
a postback.
IE9 is no longer visible.
Whatever was behind it now has focus
(and fills the screen, as it is
maximized)
Only workarounds I know:
Don't include the jQuery mobile scripts.
Ensure IE9 is the only maximized window in Windows.
I don't know what jQuery Mobile is doing in the background and am assuming this is a bug in IE9 that will eventually be fixed. However, if you had any tips on how to prevent it from happening in the meantime, that would be great.
Edit: Seems it isn't on every postback. It is on every postback that performs a Response.Redirect. I should add that all my postback are actually utilizing ASP.NET AJAX, not full postbacks.
I know this is an old post, but for people coming here from Google:
I ran into this same issue today. It seems this lose focus behavior is what IE does when you trigger the blur event on the window object. This was the code that caused this issue for me:
$(document.activeElement).blur();
activeElement will default to the body element when there are no other elements in focus, and the blur event then bubbles up to the window. To fix this I simply did a check like:
if (document.activeElement != $('body')[0]) {
$(document.activeElement).blur();
}
I had similar problem with IE10 and jQuery 1.7.2.
I found these lines in my code:
$(document.activeElement).blur();
and
$(':focus').blur();
So, adding simple .not('body') resolves the problem:
$(document.activeElement).not('body').blur();
$(':focus').not('body').blur();
This same issue seems to occur with jQuery Mobile 1.4.2.
When using IE 10, with a single tab open and another window on the same monitor, if you open a popup it will send the browser to the background.
To fix this you have to edit the _handleDocumentFocusIn function. You need to change the line(10391) that reads:
target.blur();
to
if (targetElement.nodeName.toLowerCase() !== "body")
{
target.blur();
}
I made a pull request so hopefully this will be included in the next version.
Just posting this link to anybody who is experiencing more of this continued mess. I am seeing the problem on IE 9 and IE 10 on a window.location = 'BLAH', from within the Angular location resource.
This doesn't seem to solve the problem for me, but it may help others:
http://support.microsoft.com/kb/2600156/en-us

Close event in Safari iphone?

Is there a way to know that the user is closing the navigator, and/or the tab in Safari for iPhone, so that I can save data to localStorage, or do I need to do it for every input ?
Having looked at the documentation for localStorage, I think you need to be storing the relevant data as it's generated/modified rather than waiting for a close event. I realise this is probably more work than any of us would like but at least you can be sure that you are saving the current state at each point so that even a browser crash shouldn't kill your state.
Okay, it seems like onbeforeunload is a Microsoft invention, and so is not supported by Safari nor Opera.
I'm going to have to look for another way :)
Did you try the unload event?
jQuery documentation on the unload event

Categories

Resources