使用Ajax“更改页面”时的后退按钮功能

Question

In our application, we don't have "real" links anywhere, but all the pages are loaded with ajax. This would look something like this:

function changePage(module, params){
//Ajax call is done, content is being displayed in the content div
}

And so, a "link" would just be something like this:

<div class="link" onclick="changePage('Content_Emplyee', 123)">To Employee 123</div>

This has all been working great, the only problem is, that of course, clicking the back button will leave the page. Is there any way one can override the backbutton, so it will act like the user think it would? In this case, after following the Employee link, the back button should lead back to the menu. After that, the forward button would go back into this Employee etc.

Answer 1

You can use history.js , which provides the functionality you're looking for. With it, you can handle browsers' history back calls to return to your previous state, without leaving the page.

This is very useful for one-page web application, but as already pointed out, ajax links can lead to SEO limitations.