Ajax / jQuery位置

Question

i want to add some hash ref linking that when i click on a menu button it changed to the actual section maybe from

http://www.mycompany.com/about to http://www.mycompany.com/work or maybe /something

i have this solution but i don't know how can i add this to my actually solution.

$(document).ready(function(){
     $('#allcontent').load('data/home.html');

    $('.hovers').click(function() {
       var page = $(this).attr('href'); 
    $('#allcontent').load('data/' + page + '.html');
    return false;
});
});

Here is my Fiddle: DEMO

Maybe with this? window.location.hash =

Thank you so much

Answer 1

What I think you are looking for is to load the page content through ajax and still be able to update the url to /something

http://www.mycompany.com/about to http://www.mycompany.com/work or maybe /something

To achieve this, you just need to load the content of the page you want and change the location url to the desired page name by doing something like,

<script type="text/javascript">
 function processAjaxData(response, urlPath){
  document.getElementById("content").innerHTML = response.html;
  document.title = response.pageTitle;
  window.history.pushState({"html":response.html,"pageTitle":response.pageTitle},"", urlPath);
 }
</script>

REF: Modify the URL without reloading the page

A website which has actually implemented this. What they are doing is, loading the page contents on clicking on menu items through ajax. And then setting the browser url through js. They have even kept the menu links to /pages instead of #values as this boosts seo.