Browser address bar not showing full url

[Pavlos1316]

I use this code to open the contents of my Menu Links inside my <div id="main"> so I do not need to reload the whole page each time:

.delegate('a.difflink', 'click', function(){
 $('#content').empty();
 var page = $(this).attr('id');
 $('#content').load("page_scripts/loop_a.php?page="+ page);

Problem created is that by using the above method my browser's address bar always shows www.myXample.com so I cannot create sitemap for SEO.

 

And as I understood (not sure if I am correct) the way I made it work is like there are no new urls to show (since I am just changing div content).

 

QUESTION: Is there a way to make my page work as it should e.g when I press "Downloads" --- address will show: www.myXample.com/downloads and still no need to reload the whole page?

 

A solution would be to use this in my code:

window.history.pushState('','','/downloads');

it changes the url to the desired BUT if I manually enter on my browser www.myXample.com/downloads I get just the contents of the div without any page formatting or menus, which is natural result.

 

So is there a work around to achieve my goal or is it one of two: Reloading the whole page Vs No reloading and no URLs for SEO.

[QuickOldCar]

I guess you can write or save the data with js.

 

Try adding the meta using something like opengraph to the head of the page

 

http://ogp.me/