This question already has answers here:
Prompt User before browser close?
(4 answers)
Closed 9 months ago.
I want to show a dialog when users click the X button to close the browser's window. In the dialog, it will ask users if they want to proceed with closing or not, if users choose no, it won't close the window.
I am wondering how to achieve this. I tried the unload event handler, the code was triggered but the window has already been closed. I also tried onbeforeunload, but it seems not triggered at all.
window.addEventListener('onbeforeunload ', () => {
// code not triggered here
});
window.addEventListener('unload', () => {
// code triggered but window is already closed
});
Even if we assume that there is an event handler which will be triggered before the window is closed, then what code should I write in order to prevent closing the window? It looks like once X button is clicked, the window is just "determined" to close and it's not reversible?
[https://stackoverflow.com/questions/2923139/prompt-user-before-browser-close]
this is the basic way to do
but prompt will be always the same
window.onbeforeunload = function(evt) {
return true;
}
Related
I'm opening a modal dialog. As soon as i open the modal dialog i will mask the parent window so that none of the click events can be done on the parent window.
But however, i will need to clear the mask once the child window is closed.
Below is the piece of code which will open the dialog and return the opened window reference.
this.contentWindow = openDialog(this.url);
Once i open the content window, i will apply mask on the parent window as below : Till here all is well :)
this.parentWindow.jQuery("div#layerOverlay").css('display', 'block');
But, also i need to register a call back event on the contentwindow when it's closed
this.contentWindow.onunload = function () { restoreIEMask(); };
function restoreIEMask() {
getTopWindow().jQuery("div#layerOverlay").css('display', 'none');
}
The above piece of code works fine in other browsers except in IE11. I tried various ways in attaching the callback on the contentwindow iframe etc. But nothing seems to work.
Can some please suggest how to get out of this situation.
This question already has answers here:
Is there a way to capture the alert ok button click event?
(6 answers)
Closed 8 years ago.
My question is: is there a way to target an element in the alert box, specifically the 'ok' button or which would stimulate the 'enter' key press. I have tried doing this code on the console without any success:
var e = $.Event("keydown", { keyCode: 13});
$("alert").trigger(e);
Popups such as alert halt execution of JavaScript, so you can't listen for an event on them. Better to use a modal popup such as Bootstrap's.
This question already has answers here:
Detect click outside element?
(2 answers)
Hide div when clicking outside
(3 answers)
Closed 10 years ago.
I have a webpage with several hidden divs. I have them set up so that when an image is clicked, they will display and if the image is clicked again, they hide. The problem is, I need to hide them if they're visible and any part of the page is clicked. I've searched high and low and have found some suggestions but have yet to find one that works. Can anyone help?
$(window).click(function() {
$('img').hide();
});
Very simple example
I usually bind a document.click event to listen for a click outside and then remove it when the window is closed.
// in function after your image shows up.
document.click = hideImage;
// other code to hide image when image is clicked
// in function after your image is hidden.
document.click = null;
If you're using jQuery it's easier because you can namespace your events for safe add and removal.
// in function after your image shows up.
$(document).bind('click.imagehide', hideImage);
// other code to hide image when image is clicked
// in function after your image is hidden.
$(document).unbind('click.imagehide');
This method is safer so you don't interfere with other click events bound to the document.
What you need to do is prevent event bubbling. If you are using jquery you can do:
$(document).on ('click', function () { $('div').hide (); });
$('img').on ('click', function (e) { e.stopPropagation (); });
Remeber to change the selectors to fit your needs.
It seems that Google+ checks for notification updates when I activate the tab in Firefox
It'd show "0" every time I activate it, but change to a number of new notifications in a couple of seconds after that.
What's the mechanism allowing to tap into that event? Is there a specific DOM event for that? Or are they using something like onmouseover handler and just consider any kind of activity to be a sufficient indicator of tab activation?
Just a guess because I haven't all relevant browsers available for testing.
What about using the focus event on the window. Whenever a user clicks somewhere this is invoked but also on switching of tabs. To distinguish between a user's actions on the page and a user switching to the page you could check if the event's explicitOriginalTarget points to the window.
window.onfocus=function(event){
if(event.explicitOriginalTarget===window){
console.log('switched from tab');
}
}
There is Page visibility document, which describes document.onvisibilitychange event handler.
The usage
document.onvisibilitychange = function() {
console.log("Visibility of page has changed!");
};
Unfortunately there's no 100% accurate solution
onvisibilitychange correctly triggers on tab changes, but does not trigger on window changes (ALT+TAB) visibilitychange event is not triggered when switching program/window with ALT+TAB or clicking in taskbar
window.onfocus triggers when the document becomes focused. This works as expected if the tab's focus is already inside the web page, then it correctly triggers when window or tab becomes focused.
But if you have the focus on the URL bar, or in the console, you are already "out of focus", and when you get out of the window or tab and return, you will remain "out of focus", so this event won't trigger until you click inside the page, or navigate into it through TAB key
You can test below how each event triggers (click inside the white iframe to test onfocus/onblur events)
window.onfocus = () => console.log("focus");
window.onblur = () => console.log("out of focus");
document.onvisibilitychange = () => console.log("visibilityState: ", document.visibilityState);
I want to open popup window when browser closed or closed tabs.
window.onUnLoad= function (evt) {
//your code goes here
window.open("yourpage/some link");
}
EDIT NOTE: Now it will be called on onUnload event of browser. Try now
Try window.onclose event:
Capture event onclose browser
https://developer.mozilla.org/en/DOM/window.onclose
How to capture the browser window close event?
References:
http://dotnetacademy.blogspot.com/2010/09/call-function-in-javascript-before.html
On below like you can find all events with example of window for javascript:
http://www.java2s.com/Tutorial/JavaScript/0380__Window/windowonUnLoad.htm