首页 > 其他 > 详细

对pushState、replaceState和onpopstate一点使用

时间:2017-06-26 19:53:24      阅读:322      评论:0      收藏:0      [点我收藏+]

应用场景实现点击浏览器前进和回退按钮importPage,checkPage div区块的切换

关键代码

  新建tab页,将页面url粘贴到地址拦,刷新页面,此时历史栈数为2,当前onpopstate事件回调,返回e.state为null,先替换栈里的当前页,浏览器显示checkPage页面,栈里当前页也为checkPage。

window.history.replaceState({
wid: ‘checkPage‘
}, document.title);

点击按钮,向历史栈里添加页面。

var registerBackPage = function (wid) {
    window.history.pushState({
wid: wid
}, document.title);
}
window.addEventListener("popstate", function (t) {
var wid = "";
if (t.state && t.state.wid) {
wid = t.state.wid;
} else {
return
}
switchPage($(‘#‘ + wid));
})
$("#importPageBtn").click(function () {
registerBackPage(‘importPage‘);
switchPage($(‘#importPage‘));
});

参考链接:http://www.cnblogs.com/lyzg/p/5960609.html


对pushState、replaceState和onpopstate一点使用

原文:http://www.cnblogs.com/haigelang/p/7081872.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!