在浏览器刷新时保存XHR渲染状态

Question

我有一个包含Home，About Us，Profile等菜单的php页面。现在在主页上如果单击“关于我们”链接页面没有重新加载，而是显示“关于我们”的Ajax响应一个主要的div。但是如果用户现在重新加载窗口，则显示主页的信息，但是我想在主div中保留“关于我们”信息，就像在页面重新加载之前一样。提前感谢...

Answer 1

您需要执行诸如向网址添加哈希之类的操作，以便您可以重新呈现网页的正确状态。

喜欢#!/About-us

在你的代码中检查你是否有一个哈希值，如果是这样，那么正确的渲染。 Here是这项技术的一种非常天真的实现。我强烈建议你看看那个很棒的框架。

HTML：

<a href="#!/About-us">About us</a>​

使用Javascript：

function renderAbout() {
 alert("render about");   
}

var hash = window.location.hash;

if (hash === "#!/About-us")
    renderAbout();
​

demo

有很多框架可以帮助您实现这一目标：

crossroads.js
Finch.js
David.js
jQuery BBQ

Here是关于它们的stackoverflow讨论。 而here则是关于为什么#!/About-us而不仅仅是#About-us

的一种解释