动态更改URL结构 - 后退/前进

时间:2012-07-21 07:55:52

标签: javascript jquery url-rewriting

所以我正在尝试编写一个动态加载内容的脚本,以便不必刷新页面(主要内容将被替换,但侧边栏,页眉,页脚等将保留在同一个地方)。我已经解雇了我的事件,并且我正在使用pushState()来更新我的网址。但是,我无法弄清楚应该如何使用window.history.back()window.history.forward()。我是否必须重新定义这两个功能才能使其成功旅行?

3 个答案:

答案 0 :(得分:0)

我发现做(我认为)你所追求的最简单的方法是将你的动态加载连接到你的window.location.hash,所以:

window.location.hash='page_1';

然后,您可以将事件处理程序绑定到hash change,然后转到第1页的AJAX。

更改哈希会导致新的历史记录页面,因此您根本不需要对window.history执行任何操作。

答案 1 :(得分:0)

您正在使用PushState更新网址,因此您已在所有支持该功能的浏览器中处理了您的历史记录。 但旧版浏览器不支持PushState,您可能需要测试

if (history.pushState) { //is supported }

我建议您在此处使用History.js脚本。对于HTML4浏览器和HTML5的pushState,它将恢复使用旧的onhashchange功能。您无需手动处理history.forward

另外,您还需要配置.htaccess,以便网站的书签和页面链接正常工作。

Detailed Guide

答案 2 :(得分:0)

虽然pushState()是历史记录,但您需要传递该网址,以便加载页面时不会刷新它。但是windows.history.back()将自动从浏览器缓存中访问您的最后一页。这是您没有通过任何网址。同样适用于windows.history.forward()