In general, when doing Ajax load, many people will not consider the need for browsers to support the forward back function, because most people do not know can be achieved.
Recently encountered this problem, after a short study, found that GitHub already have a ready-made open source tools to use, the main implementation of the principle is to use the HTML anchor point, namely <a href= "#xxx" >
The main demo code is as follows:
Html
Copy Code code as follows:
<ul>
<li><a href= "#ttt" >ttttttttttttttt</a></li>
<li><a href= "#aaa" >aaaaaaaaaaaaaaa</a></li>
<li><a href= "#bbb" >bbbbbbbbbbbbbbb</a></li>
<li><a href= "#eee" >eeeeeeeeeeeeeee</a></li>
<li><a href= "#mmm" >mmmmmmmmmmmmmmm</a></li>
</ul>
<div id= "Showdiv" style= "width:500px; height:500px; border:1px Groove #e3e7ea; " >default content</div>
Js
Copy Code code as follows:
<script type= "Text/javascript" >
$ (function () {
Here is the shared location, which is done by the state parameter.
$. History.bind (function (state) {
$ (' #showdiv '). Load (' action/' +state+ '. html ');
});
This is a special action on a link.
$. History.bind (' BBB ', function (state) {
Alert (' Click on the BBB link, which is the special handling location for BBB link ');
});
});
</script>
Related issues:
State parameter: The value of XXX in the hyperlink label href= "#xxx".
Order of execution: first perform a special operation, then perform a common operation.
