JS监听浏览器后退事件

在做报表开发时遇到问题:由第一层数据下钻到下一层,是在一个文件中开发,通过显示隐藏来控制,下钻到第二层后通过返回按钮来返回第一层,现根据业务需求调整,不能显示返回按钮,需通过浏览器的后退来返回到数据的第一层。

处理这个问题,首先要在下钻时,向浏览器的history插入一条记录,保证点击浏览器后退时,仍然在本文件中,而不是跳走了。其次,要监听浏览器的后退操作,处理页面显示隐藏逻辑。

1.使用pushState增加一个本页的url

function pushHistory() { 
var state = { 
title: "title", 
url: "#"
}; 
window.history.pushState(state, "title", "#"); 
}

2.通过popstate监听来处理逻辑

window.addEventListener("popstate", function(e) { 
alert("我监听到了浏览器的返回按钮事件啦");//根据自己的需求实现自己的功能 
}, false);

 

posted @ 2019-09-20 22:11  rqpjuicy  阅读(4853)  评论(0编辑  收藏  举报