Question

Like the title says, I'd like to be able to perform a different onstatechange event if the pushState function is called, instead of the back function. Or, if the go function is negative or positive.

Example:

if History.pushState() or History.go(1) are called, I want the statechange event's callback to be forwardPushState

if History.back() or History.go(-1) are called, I want the statechange event's callback to be backwardsPushState

Was it helpful?

Solution

A state is some data related to a page (as the user see it in the browser). If the user wants to be in a certain page, this page is the same, either he is coming from back button click or from forward button click.

PushState pushes a new state in the stack. It has no relationship with back and go. Back and go are functions to navigate over pushed states in stack. I say this because in your edit, it looks like you are thinking that pushState and go(1) are equivalent.

Maybe if you want to know from which direction the user is coming, you should analyse onstatechange event to know if it takes any parameter that stores direction, which is not a trivial task IMO.

The main thing I think, is that it has no relationship with the go (-1) or go(1) or back.

OTHER TIPS

Maybe this will work for you.

<html>
<body onunload="disableBackButton()">
<h1>You should not come back to this page</h1>
</body>
<script>
function disableBackButton()
{
   window.history.forward();
}
setTimeout("disableBackButton()", 0);
</script>
</html>

The code above will make it difficult to use the back button to load this page.

Second try

The code below was taken from another stack overflow.

detect back button click in browser

window.onload = function () {
if (typeof history.pushState === "function") {
    history.pushState("jibberish", null, null);
    window.onpopstate = function () {
        history.pushState('newjibberish', null, null);
        // Handle the back (or forward) buttons here
        // Will NOT handle refresh, use onbeforeunload for this.
    };
}
else {
    var ignoreHashChange = true;
    window.onhashchange = function () {
        if (!ignoreHashChange) {
            ignoreHashChange = true;
            window.location.hash = Math.random();
            // Detect and redirect change here
            // Works in older FF and IE9
            // * it does mess with your hash symbol (anchor?) pound sign
            // delimiter on the end of the URL
        }
        else {
            ignoreHashChange = false;   
        }
    };
}

}

Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top