pop up of confirmation box when closing tab/window only
Question
Hello i need a pop up message of confirmation when going to close browser/tab only, not when going to click on any link. In my code, it gave me pop up message when i close browser/tab as well as click on any link, which i don't want. I really have no idea how to do it. Can anyone please help me. My code is-
<body>
<div id="copyright">
<div class="moduletable copyright ">
<div class="custom copyright">
<p>
<span class="copy">© Copyright 2008</span>
Inc. All rights reserved. </p>
</div>
</div>
</div>
</div>
</div>
<br class="clear" />
</div>
</div>
<script language="JavaScript">
window.onbeforeunload = bunload;
function bunload(){
dontleave="Are you sure you want to leave?";
return dontleave;
}
</script>
</body>
</html>
4 answers
solution1
2 ACCPTED 2014-12-10 07:22:41
Try this:-
<body>
<a href="demo-1" onclick="prevent()">click here</a>
<script language="JavaScript">
window.onbeforeunload = function () {
return "Are you sure?";
}
function prevent() {
window.onbeforeunload = function () { };
};
</script>
</body>
solution2
1 2014-12-10 07:09:12
Your said event onbeforeunload works perfectly.
window.onbeforeunload = function(e) {
return 'Dialog text here.';
};
solution3
0 2014-12-10 07:30:30
Tl/Dr
The below code will be completely pseudo-code describing the method you'll need to run through to get this to work.
The first step is that you'll need to add an identifier to all "internal" links within your site. For example, if your page is contact, and there is a link to that page form your home page, you need to distinguish between the types of pages.
function confirmExit() {
if (!internal_link) {
// random shit..
return message
}
}
var key = "internal_link";
window[key] = false;
var message = "Your custom message. Are you sure you want to blah?";
window.onbeforeunload = confirmExit;
internal_link = false;
$(document).ready(function () {
if (!window.location.origin) {
window.location.origin = window.location.protocol + "//" + window.location.hostname
}
$("a").each(function () {
if ($(this)[0].href.indexOf(window.location.origin) == 0) {
if ($(this).attr("onclick") == "undefined") {
$(this).attr("onclick", key + " = true")
} else {
if ($(this).attr("onclick")) {
var e = $(this).attr("onclick");
$(this).attr("onclick", e + " " + key + " = true")
} else {
$(this).attr("onclick", key + " = true")
}
}
} else {
if ($(this).attr("onclick") !== key + " = true" || $(this).attr("onclick") == "undefined") {
$(this).attr("onclick", key + " = false")
}
}
});
});
The above is what I've used previously and it's worked perfectly. Basically what it does is adds an attribute to internal links (links within your site), then when users navigate around your site, the onbeforeunload runs the confirmExit() function and checks if the internal_link is false, if so, it shows the message otherwise it navigates through the site.
solution4
0 2015-01-25 07:04:05
Nothing work for me but I made it with some combinations of the above code and from other forums.
<script language="JavaScript">
window.onbeforeunload = function () {
return "Are you sure?";
};
$(document).ready(function () {
$('a').click(function () {
window.onbeforeunload = null;
});
$('form').submit(function () {
window.onbeforeunload = null;
});
});
</script>
The onbeforeunload event will be fired when you submit a form too, so we need to prevent the event.
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.