文章关键字 ‘replaceState’

小tips: 页面链接跳转历史URL不记录的兼容处理

2017年02月15日,星期三

我们点击首页的“分类”进入分类页,然后分类页头部有个“男生”“女生”的频道切换,这两个都是直接的链接,如果就会带来这么一个问题,如果用户在“男生”“女生”的频道之间反复切换,则当我们点击左上角的返回按钮(如下图)的时候,就会发现点击很多次还是在“分类页”上,这其实是不符合用户预期的,正常的用户预期应该是点击左上角的返回按钮应该直接回到首页,而不是还在当前页过家家。

要实现思路并不难,就是“男生”“女生”频道切换的时候,URL地址不要进入历史URL记录堆栈,但如何实现同时保证各个浏览器都兼容是个问题,本文就将展示相关的实践,希望对大家的学习能够有所帮助。

阅读全文…

ajax与HTML5 history pushState/replaceState实例

2013年06月19日,星期三

众所周知,Ajax可以实现页面的无刷新操作——优点;但是,也会造成另外的问题,无法前进与后退!曾几何时,Gmail似乎借助iframe搞定,如今,HTML5让事情变得如同过家家般简单。

当执行Ajax操作的时候,往浏览器history中塞入一个地址(使用pushState)(这是无刷新的);于是,返回的时候,通过URL或其他传参,我们就可以还原到Ajax之前的模样。

本demo所展示的就是ajax的内容载入与地址栏的前进与后退,典型应用,对于熟悉相关知识点很有帮助。

阅读全文…