Question

In head:

<head>
    <script type="text/javascript">                          
        $(document).ready(function() {
            $("#anchor_id").click(clickHandler);
            window.onbeforeunload = confirmExit;
        });

        function clickHandler() {
            /* hide/show some hidden div's */
            $("body").append("<p>Hi there</p>");
        }

        function confirmExit() {
            return "There are some unsaved changes on page.";
        }
    </script>
</head>

In body:

<a id="anchor_id" href="javascript: void(0);">Click Me</a>

Is it possible to prevent onbeforeunload from being called when clicking on this link in Internet Explorer? In the rest of the browsers the code is working fine.

Was it helpful?

Solution

Try setting href="#" instead, and return false in the clickHandler function (or prevent the default event by event.preventDefault())

OTHER TIPS

You could wrap the event assignment in condition browser logic using jQuery's browser helper:

http://docs.jquery.com/Utilities/jQuery.browser.version

Try this, tested in FF3.5 and IE8

<html>
    <head>
        <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
        <script type="text/javascript">
            $(document).ready(function()
            {
                $("#anchor_id").click(clickHandler);
                window.onbeforeunload = function()
                {
                    return "There are some unsaved changes on page.";
                };
            });

            function clickHandler()
            {
                /* hide/show some hidden div's */
                $("body").append("<p>Hi there</p>");
                return false;
            }
        </script>
    </head>
    <body>
        <a id="anchor_id" href="javascript: void(0);">Click Me</a>
    </body>
</html>
Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top