Search code examples
javascriptjqueryhtmlinternet-explorerback-button

detecting browser back button in javascript/jquery without using any external plugins

I want to detect browser back button in java-script/jquery without using any external plugins.

I am going to support following browsers

IE8,IE9,FireFox,Chrome

I googled so many links and found below part of code from code project 

<body onbeforeunload=”HandleBackFunctionality()”>

function HandleBackFunctionality()
{
    if(window.event)
   {
        if(window.event.clientX < 40 && window.event.clientY < 0)
        {
            alert("Browser back button is clicked...");
        }
        else
        {
            alert("Browser refresh button is clicked...");
        }
    }
    else
    {
        if(event.currentTarget.performance.navigation.type == 1)
        {
             alert("Browser refresh button is clicked...");
        }
        if(event.currentTarget.performance.navigation.type == 2)
        {
             alert("Browser back button is clicked...");
        }
    }
}

The above code working fine IE browser. that means i can able to get the window.event.clientX and clientY values in IE browser. but in chrome/firefox not working.

When browser back button is clicked, i need to refresh the page.

how can i detect browser back button click event in all browsers (IE,firefox,chrome)

any help would be appreciated.

Solution

  • That can be simply dropped into your web page, and when the user clicks back, it will call a function. The default function on this call is a javascript alert “Back Button Clicked”.

    To replace this functionality, you simply need to override the OnBack function. This can be done by using the code below.

    <script type="text/javascript">
bajb_backdetect.OnBack = function()
{
   alert('You clicked it!');
}
</script>

    This will now replace the “Back Button Clicked” alert with a “You clicked it!’” alert.
    support following browsers IE8,IE9,FireFox,Chrome
    Browser Back Button Detection
    Or using jquery
    Catching browser back
    Using standard javascript
    Mastering The Back Button With Javascript