Is it possible to trigger a function when a using closes the browser tab and prevent it from closing instead a popup will ask the user to proceed to other page or continue to close the browser page?
Scenario:
When the user closes the browser tab of a page, then it wont close right away instead a custom popup (possibly html popup) will prompt and ask if continue to close or proceed to other page. So it would have 2 buttons, "Close" and "Proceed to Page".
If it's not possible using HTML popup, prompt would be fine too. But it should be crossbrowser.
By the way, i prefer using Javascript.. So that's my ideal script to make this function work
Thanks :)
You're looking for onbeforeunload:
window.onbeforeunload = function() {
return "Are you sure you wish to leave the page?";
}
Just know that you will really annoy your visitors if you do this, it is strongly disliked.
Try this:
var popit = true;
window.onbeforeunload = function() {
if(popit == true) {
popit = false;
return "Are you sure you want to leave?";
}
}
Working Fiddle
Related
I am trying to redirect a page to another url when a user tries to close a browser window.
Can it be possible to redirect without showing any message or popup?
Thanks in advance
It is very much possible by handling "onbeforeclose" and/or "onclose" JavaScript events, but it's not a good practice as the end user does not like to be redirected to a new page upon closing the browser window.
If you want to implement it, you will just have to handle these events and inside the event handler, run the custom code...
You could do something along these lines:
<script language="JavaScript">
window.onbeforeunload = confirmExit;
function confirmExit() {
window.open("http://www.google.com","GoogleWindow");
return "Do you want to go to google?";
}
</script>
As mentioned by wanjarisushil, this is not a good method.
window.onbeforeunload = function(){
window.open("http://www.google.com","newwindow");
}
I'm trying to make a dialog box in HTA which asks if the user wants to save before closing. This is my code:
<script type="text/vbscript">
Function exit(text)
exit = MsgBox(text, vbYesNoCancel, "Dialog box")
End Function
</script>
<script type="text/javascript">
window.onbeforeunload = function(){
var x = exit("Do you want to save?");
if(x == 6){ //Yes
save();
}
else if(x == 2){ //Cancel
//Here I want to keep the window from closing
}
}
</script>
Note: I have already declared the save() function in javascript, but I wont post it here because it's complicated and it would take up much more space in the code than what is really important in this questiton.
Is there any way of keeping the window from closing in case the user clicks on cancel (either a Javascript function which I insert directly in the code or a VBScript function which I declare in the VBScript part and call in the Javascript part)? Or is there another way of doing what I want to do?
Due to a bug since IE7, you can't cancel window closing in HTA programmatically. This is browser-dependent, and can't be changed by using Quirks mode.
However, you can execute any synchronous code you need before closing. In practice the only way to save changes is to show a confirm box asking "Save changes before quit?", as you've done already. If user clicks "OK", save and let the window close, otherwise just let close.
Returning a string from onbeforeunload handler will open a native confirm box, which shows the returned text, and asks, if user wants to stay on, or leave the current page. This is not very elegant solution though.
From Help for OnBeforeUnload.
window.event.returnValue = false;
True/False or any string that causes a dialog to appear.
I want to show popup only when user close the browser window. But, In the following code. It showing popup when I refresh the page.
My Code
<script type="text/javascript">
$(document).ready(function()
{
var key = true;
$(window).bind('beforeunload', function(e){
if(key)
return confirm("Do you really want to close? This will log you out of your profile.");
e.preventDefault()
});
$(document).on("click","a",function() {
key=false;
});
});
</script>
This is essentially what you need.
Source: open a custom popup on browser window/tab close
JSFiddle: http://jsfiddle.net/SQAmG/5/
var popit = true;
window.onbeforeunload = function() {
if(popit == true) {
popit = false;
return "Are you sure you want to leave?";
}
}
EDIT
Use HTML5 Web Storage to simulate sessions within the browser. Here you would want to use sessionStorage rather than localStorage so the session ends when the browser window is completely closed.
If the sessionStorage variable is set, do not start the popup, otherwise allow the popup code to execute.
HTML5 Web Storage: http://www.w3schools.com/html/html5_webstorage.asp
If you set onbeforeunload callback, it will be executed every time whether you close the tab or refresh the page. So, lets get into some hack here. When we close the tab, the window loses its focus. So Inside onbeforeunload we will just check if the window has focus. If it has, you are refreshing the page. If it has lost focus, probably you have closed the tab.
window.onbeforeunload=function(){
if(!document.hasfocus()){
//show popup
}
}
I want to show dialog message to confirm the redirect, but I have my own Dialog window, so that code (look below) isn't ok for me.
window.onbeforeunload = confirmExit;
function confirmExit(e) {
return "Do you realy want to leave the page, miserable user?";
}
If I use, my menu is shown but page redirect before I choose any variant(yes/no):
window.onbeforeunload = confirmExit;
function confirmExit(e) {
return pcDialog.Show();
}
How can I fix this?
This is currently not possible and is a known security restriction.
A pop up is opened when a user clicks a button.
This pop up will go to a holding page, and wait for the user to leave the website or close the browser.
Then when the user leaves or closes the browser, it will redirect the pop up location to a different site.
I have tried several variants of the following code:
win=window.open('google.com','popup'); //just to illustrate the "win" = my window.open().
$(window).bind('beforeunload', function() {
window.win.location.href="http://the-new-location.com";
//tried something like this as well:
//win.location.href="http://the-new-location.com";
});
But without luck.
I am not brilliant with javascript /jquery so any help on how to make this work would be deeply appreciated.
Thanks!
I found a solution:
win=window.open('google.com','popup');
window.onunload = redirect;
function redirect(){
window.win.location.href="http://the-new-url.com";
};
I know you already have a prototype working, but if you want the jquery option:
var popup = window.open('http://google.com', 'popup');
$(window).unload(function() {
if(!popup.closed) {
popup.location.href = 'http://surveyurl.com/';
}
});
You should also be checking to see if popup.closed is there.