CODEWITHSUNDEEP
javascriptphpjquery
sandy sharma
sandy sharma

Reputation: 101

pop up of confirmation box when closing tab/window only

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>

Upvotes: 1

Views: 6631

Answers (4)

Naseer
Naseer

Reputation: 21

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.

Upvotes: 0

Darren
Darren

Reputation: 13128

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.

Upvotes: 0

Indranil Mondal
Indranil Mondal

Reputation: 2857

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>

Upvotes: 2

Pupil
Pupil

Reputation: 23978

Your said event onbeforeunload works perfectly.

window.onbeforeunload = function(e) {
  return 'Dialog text here.';
};

See it in action.

Upvotes: 1

Related Questions