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

9 浏览
0 Comments

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

我有一个带有菜单的php页面，如首页、关于我们、个人资料等。现在，如果用户在首页点击“关于我们”链接，页面不会重新加载，而是将“关于我们”的Ajax响应显示在主div中。但是，如果用户现在重新加载窗口，首页的信息会被显示出来，但我希望保持主div中的“关于我们”信息在页面重新加载之前的状态。提前感谢。

0

1 答案

0 Comments

问题：在浏览器刷新时保存XHR渲染状态的原因和解决方法。

原因：为了在页面刷新时重新渲染正确的状态，需要在URL中添加一个哈希值，并在代码中检查是否存在该哈希值，如果存在，则进行相应的渲染。

解决方法：可以使用以下代码实现：

HTML:

About us

JavaScript:

function renderAbout() {
    alert("render about");
}
var hash = window.location.hash;
if (hash === "#!/About-us")
    renderAbout();

还可以使用以下框架来实现此功能：

- crossroads.js

- Finch.js

- Davis.js

- jQuery BBQ

使用pushState等方法可以解决问题，而不会破坏URL。这样可以获得真正的URI，不依赖于JavaScript的功能。

0