码迷,mamicode.com
首页 > 其他好文 > 详细

点击浏览器返回,若无页面则跳转到指定页面

时间:2016-04-13 17:05:13      阅读:293      评论:0      收藏:0      [点我收藏+]

标签:

开头总要有点废话

这个功能在原先的js分享中 有简单的带过,这里拎出来 详细的讲解下原理和存在的问题。

知识要点

    HTML5引进了history.pushState()方法和history.replaceState()方法,它们允许你逐条地添加和修改历史记录条目。这些方法可以协同window.onpopstate事件一起工作。

使用 history.pushState() 会改变 referrer 的值,而在你调用方法后创建的 XMLHttpRequest 对象会在 HTTP 请求头中使用这个值。referrer的值则是创建 XMLHttpRequest 对象时所处的窗口的URL。

案例

假设 http://mozilla.org/foo.html 将执行如下JavaScript代码:

var stateObj = { foo: "bar" }; history.pushState(stateObj, "page 2", "bar.html");


这将让浏览器的地址栏显示http://mozilla.org/bar.html,但不会加载bar.html页面也不会检查bar.html是否存在。

假设现在用户导航到了http://google.com,然后点击了后退按钮,此时,地址栏将会显示http://mozilla.org/bar.html,并且页面会触发popstate事件,该事件中的状态对象(state object)包含stateObj的一个拷贝。该页面看起来像foo.html,尽管页面内容可能在popstate事件中被修改。

如果我们再次点击后退按钮,URL将变回http://mozilla.org/foo.html,文档将触发另一个popstate事件,这次的状态对象为null。回退同样不会改变文档内容。





点击浏览器返回,若无页面则跳转到指定页面

标签:

原文地址:http://www.cnblogs.com/cydiacen/p/5387803.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!