load part of page with ajax and jquery but show GET variable in url

Question

In order to show you what I want to do you just have to visit gmail. When you click on the inbox, the url refreshes to this?tab=mm#inbox and the only part of the page that refreshes is the big part where your e-mails are which google calls div.lm . How is that possible? Are they using cache a lot or they are using a javascript command I'm not aware of?

What I want to do is, I have a page with two different tabs.

<div id="navcontainer">
<ul id="navlist">
<li id="active"><a href="#" id="current">Products</a></li>
<li><a id="prreq" onclick="show()" >Requests</a></li>

</ul>
</div>
<div class="container"></div>

When users go on eg. cart.php they are going to the first tab. When users click on the second tab a js function is triggered which calls the file cart.php?rq=r and the results are shown in the container div. (I know that at the moment I have post)

function show(){
var prstr= ".container"; 
var data= {
    rq: "r"
};
$.ajax({
    type: 'POST',
    url: "cart.php",
    data: data,
    success: function(data1)
    {

        $(prstr).html(data1);

    }
});

}

What I want is when the user refreshes the page to still be in the cart.php?rq=r and not having to click on the tab again. I'd appreciate any help. if you need any more information please let me know Thank you in advance.

Answer 1

They are simply accessing the hash component of the url via location.hash . When the hash changes, they must have some logic that determines which part of the page to refresh.