使用单页网站并使用URL哈希和jQuery维护状态

Question

我正在研究我的投资组合,使其完全基于jQuery.所以我的问题是当你去一个页面,然后刷新然后它将再次带你到主页.实际上,我有两个问题.

1. 你如何(通过jQuery/Javascript)从网址获取"哈希码"？
   1. EG我想这个大胆部分:http://portfolio.theadamgaskins.com/Portfolio/ #graphicsDesign
2. 当您导航到新页面以包含该页面的哈希码时,如何更改地址栏中的URL？
   1. EG当你进入graphicsDesign页面时,地址栏中的链接变为http://portfolio.theadamgaskins.com/Portfolio/#graphicsDesign

Answer 1

您将锚点指向内部链接,如下所示:

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

然后简单地让jQuery响应click事件并让浏览器自然地遵循内部链接.浏览器现在应该在其地址栏中有内部链接.您可以使用以下JavaScript来解析URL,然后加载HTML文档的正确部分.您需要编写代码,以便根据浏览器内部地址加载正确的内容.

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

Answer 2

jQuery BBQ("后退按钮和查询")插件也很不错. http://benalman.com/projects/jquery-bbq-plugin/