HTML5不刷新页面修改地址栏
0
现在很多页面都是用ajax
来进行数据交互,但是有些场景就会比较尴尬,比如个人中心,进去点修改密码,但是地址栏没有变,下次复制地址后进来还是个人中心,并不是修改密码,所以就有了这个history.pushState
这个东西,直接修改地址栏的地址。
废话就这么多,看代码:
history.pushState(state, title, url);
state
:状态参数,通过history.state
可以获取,其他页面跳转的值为null
title
:页面标题(不过好像并没有什么用)
url
:修改后的地址
这个修改地址栏后放入到history
里面,使用history.back
,history.go
或者浏览器的前进后退都有效果。
还有一个history.replaceState
这个不会放入到history
中,只能修改当前地址。
DEMO地址:http://www.acgist.com/demo/history/index.html
参考文章:http://www.zhangxinxu.com/wordpress/2013/06/html5-history-api-pushstate-replacestate-ajax/