本文主要介绍html5的pushstate以及monitor浏览器返回事件的实现。主要介绍了pushstate的使用和monitor浏览器的解决方案。有兴趣的可以一起了解一下。
pushstate与监听浏览器返回解决的问题
1.实际开发：我们调用了页面A上的组件，在组件中填写内容后，发现想退出又不想填写，因为此时组件和页面A在同一个页面上。当我们点击返回的时候，给人的感觉是我们又回到了上一页，但是之前在A页填的东西都没了，极大的影响了体验。
因此，您可以使用pushstate方法来更改url，而无需刷新浏览器。当您返回时，您将返回到这一页，而不是上一页。不过这时候还需要监听返回的按钮，从而控制组件的显示和隐藏。这也很关键。否则，如果组件不隐藏，就相当于没有效果。
pushState
用法(一般情况)
函数pushHistory() {
var state={ title: ‘title ‘，URL:’ # ‘ }；
window.history.pushState(状态，’标题’，’ # ‘)；}
参数描述：
PushState()有三个参数：State是一个js对象，title是一个标题(现在忽略了)，还有一个可选的URL地址。
关于pushstate的说明
浏览器不是向服务器请求数据，而是直接更改url地址，这同样可以解释为变相的hash版本；但与hash不同，浏览器记录了pushState的历史，可以使用浏览器的前进和后退功能。
监听浏览器返回按钮
1 window . addevent listener(‘ pop state ‘，function(e){ console . log(e)；Alert(‘我听过浏览器的后退按钮事件’)；//根据自己的需要实现自己的功能}，false)；
转自：https://segmentfault.com/a/1190000022696823
关于html5的pushstate和监控浏览器返回事件的实现的这篇文章到此结束。有关html5的pushstate实现的更多信息，请搜索Script House以前的文章或继续浏览下面的相关文章。希望大家以后多多支持剧本之家！
来源：剧本之家
链接：https://www.jb51.net/html5/726535.html
