Here is how to make a user confirm that they want to browse away from your page:
<script>
window.onbeforeunload = askconfirm;
function askconfirm(){
return "Using the back/forward/refresh buttons can have unexpected results";
}
</script>
Using jQuery, you can make it so the user only has to confirm if they are leaving the page for some reason other than clicking an “a” link or submitting a form:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<script src="http://www.google.com/jsapi">
<script>
google.load("jquery", "1");
</script>
<script>
window.onbeforeunload = askconfirm;
window.doAskConfirm = true;
function askconfirm(){
if(doAskConfirm){
return "Using the back/forward/refresh buttons can have unexpected results";
}
}
</script>
</head>
<body>
<a href="">test</a>
<form>
<input type="submit" value="submit" />
</form>
</body>
<script>
$(document).ready(function(){
$("a").click(function(){
window.doAskConfirm = false;
});
$("form").submit(function(){
window.doAskConfirm = false;
});
});
</script>
</html>
About the Author
I always wondered how this was done exactly, but I never took the time to look. I’ll refer to this article when I need to use this – thanks!
btw, I like the new blog layout.
Thanks!
Yeah, this will get the job done, but I’m SURE it needs refactored. I was in a hurry when I wrote it… It’s a good starting point though!