Ajax implementation Browser Back, forward, refresh function

Refresh, add favorites and other functions normally used, you need to let the current operation on the URI reflected. But changing the URI at the same time does not cause the page to refresh, so you can do so by changing the fragment (fragment) in the URI. For example, click Tab1 to change the URI to Http://www.example.com/example.html#tab1, and then click TaB2 to change the URI to HTTP://WWW.EXAMPLE.COM/EXAMPLE.HTML#TAB2.
Copy code code as follows:

function Showtab1 () {
$ ("#tab2"). Hide ();
$ ("#tab1"). Show ();
Window.location.hash = "#tab1";
};
function Showtab2 () {
$ ("#tab1"). Hide ();
$ ("#tab2"). Show ();
Window.location.hash = "#tab2";
};

This has caused the URI to change, but either through HTTP://WWW.EXAMPLE.COM/EXAMPLE.HTML#TAB1 or http://www.example.com/example.html# The TAB2 access page displays the contents of the TAB1, so you also need to read the contents of the # after the page is loaded.
Copy code code as follows:

$ (document). Ready (ShowTab ());
function ShowTab () {
if (Window.location.hash = = "#tab2")
SHOWTAB2 ();
Else
SHOWTAB1 ();
}

This way, features such as refreshing and adding favorites are already available, but there is still trouble going forward and backwards. Although these two buttons have become available, the content of the page has not changed when clicked. We need to use the body's Onhashchange event. Onhashchange events are not supported by all browsers, and if you want to enable browsers that do not support this event to also detect changes to the content after the #, you may need to write a function to periodically detect window.location.hash changes or implement Onhashchange events yourself.