I know somethings like this;
<script>
function out() {
alert('No, stay here.');
//What to do?...
}
</script>
<body onUnload="out()">
<input />
</body>
I got some response from other community
<script>
function out() {
alert('No, stay here.');
location.href='thisPage.html';
}
But this will reload the page. I want to prevent users from moving pages without reloading page. Thank you
You can use the onbeforeunload event and take the steps whatever you want:
window.onbeforeunload = function(){
// whatever you want to do now
};
With this, you can redirect users to some other page if they try to move away from current page or any action you want to perform there.
Don't ever do this: there's a reason a user wants to leave the page, so don't force him/her to stay. A better option would be to use onbeforeunload to ask for confirmation before leaving the page.
Try return false; instead of location.href='thisPage.html';
Instead of returning nothing, add
return false;
to the end, that should work
:)
function out() {
alert('No, stay here.');
return false;
}
Related
Hey guys I am trying my best to figure it out how to remove the Javascript prompt/confirm that says "Do you want to leave this site?" like this:
https://prnt.sc/famast
Basically what's happening here is that when a modal got opened and the user click on "YES" it will redirect to a page. But I don't want the JavaScript confirmation but just redirect it to that page.
Any idea if you know some scripts that could make it happen?
Please help!
As other said above me, you can do it with onbeforeunload:
window.onbeforeunload = function() {
return '';
// The browser shows a pre-defined message so you don't have to write your own
}
You can also use addEventListener, in this way:
window.addEventListener('beforeunload', function() {
return '';
});
See an example (Link updated)
I have the following code:
<html>
<head>
</head>
<body>
<form method="post" action="something.php" name="myForm">
<input type="submit" name="homepage" value="Please Work" id="homepage">
</form>
<script>
var btn = document.getElementById('homepage'),
clicked = false;
btn.addEventListener('click', function () {
clicked = true;
});
window.onbeforeunload = function () {
if(!clicked) {
return 'If you resubmit this page, progress will be lost.';
}
};
</script>
</body>
</html>
This code pops a confirmation box when the user leaves the page (Back or Refresh Browser Button) but not when a button inside the form is clicked.
QUESTION
How can I redirect to a different page when the user clicks the "Leave this Page" button of the confirmation box? I tried different methods but it does not work. I'm using Google Chrome.
Any help is very much appreciated. Thank you in advance. :)
EDIT
So I got some codes that actually works but it does the opposite. When I click the "Leave this Page" it stays and when I click "Stay on this Page" it redirects.
var onUnloadClick = 0;
function redirectTimer() {
setInterval(function(){window.location = "sample exam.php"},10);
}
var btn = document.getElementById('homepage'),
clicked = false;
btn.addEventListener('click', function () {
clicked = true;
});
window.onbeforeunload = onbeforeunload_Handler;
function onbeforeunload_Handler() {
if(!clicked) {
if(onUnloadClick == 0) {
redirectTimer();
return 'If you resubmit this page, progress will be lost.';
}
}
};
QUESTION
How will I modify this code and do the opposite function?
You can't mess with the browsers processes. If you click back, it will go back. If you click refresh, it will refresh the page. The reason they're in there is because they have their functions. You can try different approach in doing what you want but I don't think this one is possible.
I dont think that its possible. Check out answer here:
Intercept selection in window.onbeforeunload dialog
There is not defined way to intercept the onbeforeunload event. Further reference can be seen here:
Intercept selection in window.onbeforeunload dialog
When onbeforeunload event is kick started the user has already selected where he\she wants to go; it would not make sense if the browser allows javascript on a webpage to override the actions of the user.
Hence there should not be anyway for you take the user to some other location other than where the user wants to go.
Updated Answer to the Updated Questions:
Its not possible to do what you are trying to do. The reason you get redirected when you choose "stay on this page" and not otherwise is because your javascript function to redirect comes into effect only why you stay on the page. When you choose to leave the page the browser will no longer execute any of your code. Because the browser does not want you to override the choice fo the user.
My recommendation:
Rethink what you want. You want to redirect the user to a different page when the user is trying to go somewhere else. I really don't think that is the correct.
What is your ultimate goal? If you let me know that.. probably I can provide you with a better solution.
I need to prompt a user when they are leaving my ASP.Net page unexpectedly with a message to ask if they are sure they want to leave. A post back or when the save button is clicked should not fire the warning. There are a bunch of articles covering this but I am brand new to this and appear to have got my wires crossed.
The recommended way appears to be to use the window.onbeforeunload event but behaves unexpectedly for me. This is fired when the page loads as opposed to when the page unloads.
<script language="JavaScript" type="text/javascript">
window.onbeforeunload = confirmExit;
function confirmExit() {
return "You have attempted to leave this page. If you have made any changes to the fields without clicking the Save button, your changes will be lost. Are you sure you want to exit this page?";
}
</script>
If I use the JQuery implementation it fires when the page unloads but the problem is it fires before the code behind is executed. So I cannot set a variable on the client saying don’t fire the event this time as it is a post back or a Save.
$(window).bind('beforeunload', function () {
return 'Are you sure you want to leave?';
});
Can anyone point me in the correct direction as I know I am making basic mistakes/miss-understanding?
Edit:
So I am nearly there:
var prompt = true;
$('a').live('click', function () {
//if click does not require a prompt set to false
prompt = false;
});
$(window).bind("beforeunload", function () {
if (prompt) {
//reset our prompt variable
prompt = false;
//prompt
return true;
}
})
Except the problem is in the above code I need to be able to differentiate between the clicks but I haven't been able to figure that out yet i.e. I am missing a condition here "//if click does not require a prompt set to false".
Any ideas?
Thanks,
Michael
You can try using this:
$(window).unload(function(){
alert('Message');
});
In case people are interested this is the roundabout solution to my problem. How to tell if a page unload in ASP is a PostBack
Is there any way that I can identify that the user clicked the "Back" button before this page?
This is the none-existed example I have in my head:
window.onload = new function(e){
if(e.type == "back"){
//do some operation
}
}
Is there a way to know that?
Thanks
Within your own site, and with a lot of work, you could do it with a cookie, but you would have to hook every link.
yes, easily.
window.onbeforeunload = askConfirm;
function askConfirm(){
return "You have unsaved changes.";
}
I want to know how can I display a confirmation box when the users try to get out of the page, like this one here in StackOverflow when you try to close the "Ask Question" page.
Thanks you in advance.
Actually, all that is necessary is this:
window.onbeforeunload = function(){ return "You should save your stuff."; }
This is also kind of a dupe of this: How to show the "Are you sure you want to navigate away from this page?" when changes committed?
In javascript, attach a function to window.onbeforeunload, like so:
window.unbeforeunload = function (e)
{
// return (prompt ('Are you sure you want to exit?'));
// EDIT: Amended version below:
var e = e || window.event;
if (e) e.returnValue = 'Your exit prompt';
return 'Your exit prompt';
}
EDIT:
As the comments below indicate, I had misunderstood the working of the event. It should now work as intended.
Ref: window.onbeforeunload (MDC)
probably a dupe: How do you prevent a webpage from navigating away in JavaScript?, but you can do this by adding an delegate to the window.onbeforeunload event
<script type="text/javascript">
window.onbeforeunload = function() {
//will show a dialog asking the user if
//they want to navigate away from the current page
// ok will cause the navigation to continue,
// cancel will cause the user to remain on the current page
return "Use this text to direct the user to take action.";
}
</script>
Update: doh! updated code to do what the OP really wanted :D
You want to catch the onbeforeunload event of window. Then if you return a string, the browser will display your message in a prompt. Here's an article with sample code.
You can use the window.onbeforeunload event to catch this. If there is any value inside the textarea then an alert message is shown.
That's browser based.
As long as you implement <form> tag, and you type in something in the form, and in Google Chrome, it will prompt you that message.