I have added AJAX to a client's site to enable some simple animation of page transitions. So if we navigate to his homepage (with js enabled) at firedogcreative.com and then navigate to his edit page, and then to one of his work pages; we end up with a history something like this:
firedogcreative.com --> firedogcreative.com/#edit --> firedogcreative.com/#example1
Ajax takes care of loading the content of each of those pages in, it updates the hash in the URL bar in each case, and all works exactly as planned.
When a user clicks the back button, though, I'm not sure I understand what is happening. If they are at #example1
and hit the browser's back button, the URL bar updates to firedogcreative.com/#edit
, but the page content doesn't change. If the user then reloads the page, though, it correctly reloads to #edit
.
I tried adding this, which I thought would cause the pages not to cache and thus each back button call would reload the page, but it didn't seem to have an effect:
window.onbeforeunload = function () {
// stuff do do before the window is unloaded here.
};
If that worked, it would be a passable solution. The page would only ever ACTUALLY reload when the user uses the forward/back buttons, which would be fine.
So my question is, what is going on with the back button? Shouldn't onbeforeunload
be causing the backbutton to reload based on the stored URL?