I have an anchor tag whose click event calls a JavaScript function, which opens a pop up window.
Now when the user clicks the close button of the pop up window I want to generate an alert(), which asks whether the user wants to close the pop up window or not
Using the below code the alert is generate in the parent window rather than the pop up
<script>
function openForm()
{
var new_window = window.open('file:///C:/Users/Tejora/Desktop/test.html','popup''width=825,height=585,scrollbars=yes,resizable=yes,toolbar=no,directories=no,location=no,menubar=no,status=no,left=50,top=0');
new_window.onbeforeunload = function(){
alert("Are you sure you want to close the window"); }
}
</script>
Click
Thanks in advance...
When a string is returned from the onbeforeunload handler, the browser will display a confirmation dialog with that message. Replace this line:
alert("Are you sure you want to close the window");
With this:
return "Are you sure you want to close the window?";
Here is the relevant documentation.
I am trying to display a confirmation message when the user closes the browser/tab and not when any of the links on page is clicked.
I have got the first part of displaying the message on window close working nicely but problem is that the message/alert is displayed also when user clicks on any link on the page.
I have got code from somewhere to prevent this behavior but still when ever any link is clicked the alert pops up.
Here is the code:
<script src="js/jquery-1.7.1.min.js"></script>
<script src="js/jquery-ui.min.js"></script>
<script type="text/javascript" src="js/backfix-min.js"></script>
$(document).ready(function() {
$(window).bind('beforeunload', function(e){
$("#lead-gen-modal").dialog("open");
// This line only appears in alert boxes for IE
return "Wait\! Don\'t Go\! We have a special offer for you\. Stay on this page to receive big savings\!";
});
$("a").click(function() {
window.onbeforeunload=null;
});
});
just use a global variable
and set it to false when clicking a link.
var key = true;
$(window).bind('beforeunload', function(e){
if(key)
$("#lead-gen-modal").dialog("open");
});
update :
$(document).on("click","a",function() {
key=false;
});
or if you just want to prevent closing window you can do this :
window.onbeforeunload = function(e){
if(key)
return false;
}
I think you are looking for something like this.
$(window).unload(function() {
alert("bye");
});
If that does not work on Chrome try this
$(window).on('beforeunload', function() {
return "bye";
});
jQuery API: unload() http://api.jquery.com/unload/
I want to implement when a user closes its browser, a pop apppear, when user click on leave this page then it will redirect to another page.
For this I have tried
<script language="JavaScript">
window.onbeforeunload = function() {
return 'Are you sure?';
}
</script>
POP up window is appearing. But I don't know how redirect to a page when user click on leave this page.
Plz provide me solutions
By using your code
<script language="JavaScript">
window.onbeforeunload = function() { return 'Are you sure?'; }
</script>
In your html, add redirect <a>
Change url
After click <a>, the confirm message will popup
==============Edit
When clicking <a>, window.onbeforeunload will trigger,
that's mean confirm message popup.
I want to make a confirmation before user leaving the page. If he says ok then it would redirect to new page or cancel to leave. I tried to make it with onunload
<script type="text/javascript">
function con() {
var answer = confirm("do you want to check our other products")
if (answer){
alert("bye");
}
else{
window.location = "http://www.example.com";
}
}
</script>
</head>
<body onunload="con();">
<h1 style="text-align:center">main page</h1>
</body>
</html>
But it confirm after page already closed? How to do it properly?
It would be even better if someone shows how to do it with jQuery?
onunload (or onbeforeunload) cannot redirect the user to another page. This is for security reasons.
If you want to show a prompt before the user leaves the page, use onbeforeunload:
window.onbeforeunload = function(){
return 'Are you sure you want to leave?';
};
Or with jQuery:
$(window).bind('beforeunload', function(){
return 'Are you sure you want to leave?';
});
This will just ask the user if they want to leave the page or not, you cannot redirect them if they select to stay on the page. If they select to leave, the browser will go where they told it to go.
You can use onunload to do stuff before the page is unloaded, but you cannot redirect from there (Chrome 14+ blocks alerts inside onunload):
window.onunload = function() {
alert('Bye.');
}
Or with jQuery:
$(window).unload(function(){
alert('Bye.');
});
This code when you also detect form state changed or not.
$('#form').data('serialize',$('#form').serialize()); // On load save form current state
$(window).bind('beforeunload', function(e){
if($('#form').serialize()!=$('#form').data('serialize'))return true;
else e=null; // i.e; if form state change show warning box, else don't show it.
});
You can Google JQuery Form Serialize function, this will collect all form inputs and save it in array. I guess this explain is enough :)
This what I did to show the confirmation message just when I have unsaved data
window.onbeforeunload = function() {
if (isDirty) {
return 'There is unsaved data.';
}
return undefined;
}
returning undefined will disable the confirmation
Note: returning null will not work with IE
Also you can use undefined to disable the confirmation
window.onbeforeunload = undefined;
This will alert on leaving current page
<script type='text/javascript'>
function goodbye(e) {
if(!e) e = window.event;
//e.cancelBubble is supported by IE - this will kill the bubbling process.
e.cancelBubble = true;
e.returnValue = 'You sure you want to leave?'; //This is displayed on the dialog
//e.stopPropagation works in Firefox.
if (e.stopPropagation) {
e.stopPropagation();
e.preventDefault();
}
}
window.onbeforeunload=goodbye;
</script>
In order to have a popop with Chrome 14+, you need to do the following :
jQuery(window).bind('beforeunload', function(){
return 'my text';
});
The user will be asked if he want to stay or leave.
You can use the following one-liner to always ask the user before leaving the page.
window.onbeforeunload = s => "";
To ask the user when something on the page has been modified, see this answer.
Most of the solutions here did not work for me so I used the one found here
I also added a variable to allow the confirm box or not
window.hideWarning = false;
window.addEventListener('beforeunload', (event) => {
if (!hideWarning) {
event.preventDefault();
event.returnValue = '';
}
});
Normally you want to show this message, when the user has made changes in a form, but they are not saved.
Take this approach to show a message, only when the user has changed something
var form = $('#your-form'),
original = form.serialize()
form.submit(function(){
window.onbeforeunload = null
})
window.onbeforeunload = function(){
if (form.serialize() != original)
return 'Are you sure you want to leave?'
}
<!DOCTYPE html>
<html>
<body onbeforeunload="return myFunction()">
<p>Close this window, press F5 or click on the link below to invoke the onbeforeunload event.</p>
Click here to go to w3schools.com
<script>
function myFunction() {
return "Write something clever here...";
}
</script>
</body>
</html>
https://www.w3schools.com/tags/ev_onbeforeunload.asp
Just a bit more helpful, enable and disable
$(window).on('beforeunload.myPluginName', false); // or use function() instead of false
$(window).off('beforeunload.myPluginName');
I want when a user closes the tab or window or when he tries to move to another location different from my site to pops a confirm box, and if he confirm to execute an ajax script and then to close or change the window. I don't know how to do that. PS: I'm using jQuery.
$(window).unload(function() {
var answer=confirm("Are you sure you want to leave?");
if(answer){
//ajax call here
}
});
Just add your own alert/dialogue code to the function.
<script language="JavaScript">
function unload() {
alert('window closed');
}
window.onunload = unload;
</script>