show alert message when closing a window? Not Working - javascript

I want to show alert before closing a prticluar tab. I have tried different codes over here but couldn't suceeded somwhow.. could somebody guide me where I am going wrong..
My Last try was :
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js" />
</head>
<body>
<script>
window.onbeforeunload = function (event) {
var message = 'Sure you want to leave?';
if (typeof event == 'undefined') {
event = window.event;
}
if (event) {
event.returnValue = message;
}
return message;
}
</script>
</body>
</html>

Depending on your browser your code works. I've updated the snippet below so it always sets a returnValue which is required by some browsers. If you click the Run code snippet button below and attempt to close the tab you'll get an alert asking if you're sure you want to leave.
However what's important to know is that most browsers have removed the ability to serve custom messages on these alerts for security purposes.
window.onbeforeunload = function (event) {
event.preventDefault();
event.returnValue = '';
};

Related

java script code for preventing user from closing browser without alert messege in chrome

This code is giving alert message but I want to prevent user from closing browser. If I comment this line and place alert code before below given code it works, but I want not to show any dialog box.
set Interval(function () {alert("**Hello")}, 10);
I tried above code but I close browser from current tab also:
{
window.onbeforeunload = confirmExit;
function confirmExit() {
return "You have attempted to leave this page. Are you sure?";
}
confirmExit();
}
Try this Code..
window.onbeforeunload = function (e) {
e = e || window.event;
// For IE and Firefox prior to version 4
if (e) {
e.returnValue = 'Any string';
}
// For Safari
return 'Any string';
};
Here is the Fiddle try this also.....

Conditional onbeforeunload event in a page

window.onbeforeunload = function(evt) {
var message = 'Are you sure you want to leave the page. All data will be lost!';
if (typeof evt === 'undefined') {
evt = window.event;
}
if (evt && !($("#a_exit").click)) {
evt.returnValue = message;
}
return message;
};
I want user to leave the page clicking to the link (has id ="a_exit") only. In other circumstances such as refreshing the page, clicking another link, user will be prompted that if he/she wants to leave the page. I have tried to use the code above. It still asks me if I want to go away when I click the exit link.
$(window).bind('beforeunload',function() {
return "'Are you sure you want to leave the page. All data will be lost!";
});
$('#a_exit').live('click',function() {
$(window).unbind('beforeunload');
});
Above works for me
My quick example of the conditional prompt before leaving page:
window.onbeforeunload = confirmExit;
function confirmExit(event) {
var messageText = tinymce.get('mMessageBody').getContent();
messageText = messageText.trim();
// ... whatever you want
if (messageText != "")
return true;
else
return void (0);
};
It works under Chrome, FF.
You can return null when you do not want the prompt to show. Tested on Chrome 79.
window.onbeforeunload = () => {
if(shouldPrompt){
return true
}else{
return null
}
}
BTW modern browser no longer support custom onBeforeUnload promp text.
It will always prompt you if you want to leave the page. It's a security issue and cannot be worked-around.
Moreover, anything you return in the onbeforeunload event handler that is not void will be treated as the message for the prompt. Refer to this article: https://developer.mozilla.org/en-US/docs/Web/API/Window.onbeforeunload
This worked for me.
window.onbeforeunload = function(){
if(someBoolean) {
return 'message'
}else{
window.onbeforeunload = null;
}
}
You could just remove window.onbeforeunload in the click handler.
How about a variable to decide, if the link was clicked?
var exitClicked = false;
$("#a_exit").click(function() {
exitClicked = true;
});
window.onbeforeunload = function(evt) {
//...
if(evt && !exitClicked) {
evt.returnValue = message;
}
//...
};
You only set exitClicked = true when the link was really clicked and afterwards, before unloading you can simply check this variable.
This is quite old but I wanted just to change the code given that .live is no longer working in Jquery. So, the updated version would be:
$(window).bind('beforeunload',function() {
return "'Are you sure you want to leave the page. All data will be lost!";
});
$('#a_exit').on("click", function(){
$(window).unbind('beforeunload');
});

how to close a popup window when the focus is gone out from it

Requirement: A popup will be opened up from parent window, and it should get closed when the focus from the window is lost. (This should happen even when another application window is opened or came into focus).
Tried code:
<body onBlur='javascript:window.close();'>
Issue:
On click within the body of the popup makes the popup closed.
Compatibility: ie6 and above, firefox.
I got a workaround from http://pro-thoughts.blogspot.com/2006/10/incorrect-behavior-of-windowonblur.html
var active_element;
var bIsMSIE;
function initiateSelfClosing() {
if (navigator.appName == "Microsoft Internet Explorer") {
active_element = document.activeElement;
document.onfocusout = closeWnd;
bIsMSIE = true;
}
else { window.onblur = closeWnd; }
}
function closeWnd() {
if (window.opener != null) {
if (bIsMSIE && (active_element != document.activeElement)) {
active_element = document.activeElement;
}
else {
window.close();
}
}
}
<body onload="initiateSelfClosing()">
</body>
But here also one problem is there, if there is a print button in the page, and if am clicking on print > then cancelling the print job, the popup is getting closed.
Can some one help me pls...
Little corrections in sathishkumar's answer
1.we need to convert win to jquery object
2.Apply blur event on jqvariable and not on window
3.this.close is good enough in definition of onblur event
var win = window.open("URL");
var jqwin = $(win);
$(jqwin).blur(function() {
this.close();
});
Use document for blur event
var win = window.open("URL");
$(window).blur(function() {
win.close();
});
You cannot attach onblur event to BODY but
you Can attach a function on Onblur event of window.
<script type="text/javascript">
function closeme()
{
window.close();
}
window.onblur=closeme;
</script>
Since you have Edited your Question, You can get more help here

How to capture browser close event?

I want to capture the browser close event in my application and show a confirm box to user.
I am using JSF 2.0 and richfaces 4.0.
window.onbeforeunload = function ()
{
var shallIAlertUser = Do_Whatever(); //get boolen value
if (shallIAlertUser) {
//this will alert user
return 'Are you sure?';
}
else {
//this wont
window.onbeforeunload = undefined;
}
};
Use the beforeunload event.
window.onbeforeunload = function(event) {
event = event || window.event;
var confirmClose = 'Are you sure?';
// For IE and Firefox prior to version 4
if (event) {
event.returnValue = confirmClose;
}
// For Safari
return confirmClose;
}
Keep in mind this will be fire for other events besides closing the window, such as reloading and form submission.
onbeforeunload
< body onbeforeunload="alert('Closing');">
Example :
<html>
<head>
<title>`onbeforeunload` Event Demo</title>
</head>
<body onbeforeunload="return 'Are you sure you want to exit ?';">
</body>
</html>
Attach a handler to the unload event.

Handle refresh page event with JavaScript

Is it possible to use JavaScript to handle the event of refreshing page?
What I want is get notice if user do one of these behaviours:
refresh page by pressing F5
close tab or browser
enter a new url then press enter on
browser
to display a warning message?
You don't want the refresh, you want the onbeforeunload event.
http://msdn.microsoft.com/en-us/library/ms536907(VS.85).aspx
Sample code from article
<HTML>
<head>
<script>
function closeIt()
{
return "Any string value here forces a dialog box to \n" +
"appear before closing the window.";
}
window.onbeforeunload = closeIt;
</script>
</head>
<body>
<a href="http://www.microsoft.com">Click here to navigate to
www.microsoft.com</a>
</body>
</html>
The closest you could get is the window.onbeforeunload event:
window.onbeforeunload = function (e) {
var e = e || window.event;
// For IE and Firefox
if (e) {
e.returnValue = 'Leaving the page';
}
// For Safari
return 'Leaving the page';
};
It is important to note that you need to return a string from this function.

Categories

Resources