How to detect back navigation


Yet another use of pagecontainerbeforechange; it is navigate, hashchange and popstate all in one event! Whether browser’s back button or $.mobile.back() is used, pagecontainerbeforechange is what you need.

As I have mentioned in my previous article about that event, it event fires twice on each page change, first time it returns toPage as a string, and second time as an object. To alter toPage value, it should be a string, so you need to do changes on first time it fires.

Navigation direction can be obtained from options.direction, it can be back or forward.

$(document).on("pagecontainerbeforechange", function (e, data) {
    if (typeof data.toPage == "string" && data.options.direction == "back" && data.prevPage[0].id == "PageX") {
        data.toPage = "#pageY"; /* redirect to pageY */
        data.options.transition = "flip"; /* optional */
    }
});

Demo

Advertisements

Drop me a line or two ;)

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s