動態加載內容

Question

我想使用Ajax加載內容並保持重新加載標題，類似於此站點。

到目前為止，我有這個，但不知道還有什么可以添加，以獲得相同的效果。 我注意到在該網站上，URL也會隨着標題的內容而改變，這正是我想要的。 查看源代碼后，除了注意URL中的.php擴展名外，我找不到任何他正在使用的內容。

$('nav li a').click(function(){
  // var pageurl = $(this).attr(href);
  var pageurl = $(this).attr('href');

  $('#wrap').load(pageurl);
});

我究竟做錯了什么？

更新

對不起，我確實錯過了href的引用，雖然它仍然不適合我。

Answer 1

$('nav li a').click(function(e){
  var pageurl = $(this).attr('href');

  $('#wrap').load(pageurl);

  e.preventDefault();
});

您需要在attr周圍添加引號，並通過添加preventDefault（）來停止更改頁面的鏈接。

編輯：

我剛注意到你的選擇器是：

$('nav li a')

你確定它不是#nav或.nav （用於ID或類）嗎？

Answer 2

要在地址欄中實現更改，您需要使用窗口的歷史對象。

從該頁面：

var stateObj = { foo: "bar" };
history.pushState(stateObj, "page 2", "bar.html");