Enabling back/fwd key events for an Ajax Application

I have an application which works heavily on AJAX. However I want to have navigation functionalities in it. To spoof the url, I am changing the location.hash, to generate URL. But if i use back/fwd, only the url changes, but page wont reload. How can I override the hstory.back to reload the page.



I don't know of any other way than continuous polling to implement this behaviour. An implementation might look like this:

var lastHash = '';

function pollHash() {
    if(lastHash !== location.hash) {
        lastHash = location.hash;
        // hash has changed, so do stuff:

setInterval(pollHash, 100);

You can't exactly capture the back event, but most of these problems have been solved - and a good thing too, it's a hard problem.

Take a look at really simple history (aka RSH) and either implement it or work through it to see how it works.


The answer for this question will be more or less the same as my answers for these questions:

In summary, two projects that you'll probably want to look at which explain the whole hashchange process and using it with ajax are:

  • jQuery History (using hashes to manage your pages state and bind to changes to update your page).

  • jQuery Ajaxy (ajax extension for jQuery History, to allow for complete ajax websites while being completely unobtrusive and gracefully degradable).


The balupton answers are really great.

But you also have another jQuery Plugin to handle your ajax requests, it is address.


Recent Questions

Top Questions

Home Tags Terms of Service Privacy Policy DMCA Contact Us

©2020 All rights reserved.