window.history.pushState（）数据，它们如何以及何时被检索？

window.history.pushState([data], 'Title', '/url');

当我设置在这里的数据，我怎么能使用它们，什么样的数据，这是意味着？window.history.pushState（）数据，它们如何以及何时被检索？

来源

2017-06-18 Yuri Nko

的data目的是为了存储结构您选择的与历史项目相关的数据，以便在重新审视州时ed，应用程序有一些与其相关的数据。也许你可以保存用户以前查看的页面的位置，或者他们已经输入但从未提交过的某些表单选项。

浏览器将调用方法时后退按钮被激发，这将弹出最近的状态压入堆栈。开发人员应该为window对象添加一个事件侦听器来自定义处理popstate事件（例如使用与状态相关的数据）。

// Below function will get fired for every app-wide popstate 
window.addEventListener('popstate', function(event) { 
    // Can access state data using event.state.data 
});

来源

2017-06-18 17:13:14 JLewkovich

谢谢，现在我明白了，但是当我点击按钮时页面会再次从url加载，我可以使用javascript加载之前的内容吗？ –

@YuriNko它将不得不在页面加载之间持续，这就是为什么pushState打算在这里使用。但是，您也可以尝试sessionStorage/localStorage，它将保存用户信息，直到关闭浏览器。 – JLewkovich

谢谢，我已经知道了thos ...我采用这种方法只是从服务器加载JSON，而不是每次都加载整个html ...也不会重新加载其他内容也是有用的。 –

这就好比一个unqiue标识符到被按下的状态。当你想替换状态为特定状态的时候，它会很有帮助。

例子：

存储状态： var stateObj = { foo: "bar" }; history.pushState(stateObj, "page 2", "bar.html");

你能做到这一点，以取代状态： history.replaceState(stateObj, "page 3", "bar2.html");

参考：https://developer.mozilla.org/en/docs/Web/API/History_API#The_pushState()_method

来源

2017-06-18 17:12:54 gauravmuk

老兄，我不需要替换，我需要调用这些数据，但问题解决了。 –

window.history.pushState（）数据，它们如何以及何时被检索？

回答

相关问题