使用單頁網站和使用URL哈希和jQuery維護狀態

我正在處理我的投資組合，使其完全基於jQuery。所以我的問題是，當你去一個頁面，然後刷新，然後它會帶你到主頁了。所以我有兩個問題，實際上。使用單頁網站和使用URL哈希和jQuery維護狀態

你（通過jQuery/Javascript）從網址獲取「哈希碼」？
1. E.G.我想這個大膽部分：http://portfolio.theadamgaskins.com/Portfolio/#graphicsDesign
如何改變在地址欄中的URL，當你瀏覽到一個新的頁面，包含該頁面的哈希碼？
1. E.G.當你走在graphicsDesign頁面，在地址欄上的鏈接http://portfolio.theadamgaskins.com/Portfolio/#graphicsDesign

2010-11-06 Entity

還要注意的是，如果你希望爲谷歌索引你的網頁，你可能最終只有一個頁面谷歌索引。所以對於SEO目的來說，這可能是一場噩夢。 – 2011-07-08 18:38:02

解決方案：http：//www.asual.com/jquery/address/docs/ – tetris 2012-03-20 13:37:32

爲了迴應納丹..我同意。這將創建重複的內容，因爲您的網頁上的所有日期都與搜索引擎相同。視圖中的變化只在前端，但谷歌索引全部！ – 2012-04-30 10:19:15

您做出錨點的內部鏈接，像這樣：

<a href="#graphicsDesign">Graphics</a>

，然後簡單地做的jQuery響應點擊事件並讓瀏覽器自然遵循內部鏈接。瀏覽器現在應該在地址欄中有內部鏈接。您可以使用以下JavaScript解析the URL，然後加載HTML文檔的正確部分。您需要編寫代碼，以便根據瀏覽器的內部地址加載正確的內容。

if(window.location.hash === "graphicsDesign" || 
window.location.hash === "somethingElse") { 
    loadContent(window.location.hash); 
}

2010-11-06 14:07:46 Sam152

所有頁面都包含在一個html文檔中，並且jQuery在頁面加載時隱藏了除頁面之外的所有頁面。所以我需要在JavaScript中獲得哈希碼，以便我可以告訴jQuery顯示哪個頁面。 – Entity 2010-11-06 14:10:02

從所有div開始隱藏並讓 – hybernaut 2010-11-06 15:39:02

'〜散列===「graphicsDesign」'應該有一個像它這樣的散列表面「〜散列===」#graphicsDesign「'@ Sam152 – 2015-06-17 21:18:37

2010-11-06 14:18:33

這更多地用於你可以鏈接其他人並且正確的內容將被加載，而不是太多以至於你將能夠來回導航。 – Sam152 2010-11-06 14:20:09

它也會使後退和前進按鈕按預期工作，並允許刷新後頁面以正確的狀態重新加載 – 2010-11-06 14:31:03

jQuery燒烤（「後退按鈕&查詢」）插件是相當不錯的。 http://benalman.com/projects/jquery-bbq-plugin/

2010-11-06 15:22:00 leppert

這不是網站通常建造的方式，所以從某種意義上說，你是向上遊游泳。當你開始的時候，它可能看起來是較短的路徑，但是你可能會發現，作爲你最初的決定，你必須做更多的工作。

也就是說，一定要從隱藏的所有div開始，然後顯示選定的div。

我還建議牛仔的燒烤插件，它會幫助你處理後退按鈕以及重裝：http://benalman.com/projects/jquery-bbq-plugin/

2010-11-06 15:43:38 hybernaut

回答