jquery ajax调用“后退按钮”实现

Question

我想在这个完整的ajax网站上实现后退按钮..我试过jQuery历史插件，但我敢肯定我搞砸了一些东西，因为哈希显示OK，但后退按钮将不加载原来的内容后面..

这是我的菜单是什么样子：

 <div id="nav" class="ajaxload menu"> 
      <ul> 
       <li><a href="home.aspx">Home</a></li> 
       <li><a href="about.aspx">About Us</a></li> 
       <li><a href="contact.aspx">Contact</a></li> 
      </ul> 
     </div>  

而Ajax调用：

 $(function() { 
      var $content = $('#content'); 
      $('.ajaxload li a').click(function() { 

       $content.html('<div id="loader"></div>'); 

       var url = $(this).attr('href'); 
       $.get(url, function(data) { 
        $content.hide().html(data).fadeIn("slow", function() { $("#loader").fadeOut("fast") }); 
       }); 
       return false; 
      }); 
     }); 

Answer 1

我猜，当你使用历史插件你可能没有初始化它。当你初始化它时，你会传递一个处理散列变化的回调，以便你可以再次加载内容。因此，举例来说，而不是做这样的事情：

$('a').click(function clickedLink() { 
    var href=$(this).attr('href'); 
    $.history.load(href); 
    doSomeAJAXRequest(href); 
    return false; 
}); 

你不得不做这样的事情：

$.history.init(function hashChanged(hash) { 
    doSomeAJAXRequest(href); 
}); 
$('a').click(function clickedLink() { 
    var href=$(this).attr('href'); 
    $.history.load(href); 
    return false; 
});