想问一下如何截获浏览器的回退动作

那年桃花盛开时节 2014-03-21 03:26:18
问题如上,我想在按浏览器的返回箭头时,不让浏览器换页,怎么用做到,并获取用户的这次事件
...全文
5741 6 打赏 收藏 转发到动态 举报
写回复
用AI写文章
6 条回复
切换为时间正序
请发表友善的回复…
发表回复
卖水果的net 2014-03-22
  • 打赏
  • 举报
回复
可以试试 unload 事件,就是和 window.load() 相反的那个,具体我也不清楚。
keatkeat1987 2014-03-22
  • 打赏
  • 举报
回复
window.onpopstate = function () { //do something .. } html5 可以监听每次地址更换 。 如果是旧游览器你可以用 # ,监听hash change event
Rommel_Gao 2014-03-22
  • 打赏
  • 举报
回复
同意楼上,不建议改变浏览器的这些行为,特别是不通知用户的前提下,这样改变了用户的使用习惯,会对用户产生不必要的困惑。 但是也提供另外一种方法,可以考虑用history API方法解决。 这么试试: go.html
<html>
<head>
<title>Go</title>
</head>
<body>
    <input type="button" value="Go" onclick="window.location.href = 'back.html#no-back';" />
</body>
</html>
back.html
<html>
<head>
    <title>No Backwards</title>
    <script type="text/javascript">
        var history_api = typeof history.pushState !== 'undefined'; 
        if (location.hash == '#no-back') {
            if (history_api)
                history.pushState(null, '', '#stay');
            else
                location.hash = '#stay';

            window.onhashchange = function() {
                if (location.hash == '#no-back') {
                    alert("No backwards!");
                    if (history_api)
                        history.pushState(null, '', '#stay');
                    else
                        location.hash = '#stay';
                }
            }
        }
    </script>
</head>
<body>
    <div>
        No backwards...</div>
</body>
</html>
需要注意的是:IE10以上才支持hisotry api方法。 参考:http://jordanhollinger.com/2012/06/08/disable-the-back-button-using-html5
  • 打赏
  • 举报
回复
或者前进,也不刷新页面,又回到我刚才的操作状态
  • 打赏
  • 举报
回复
我想要达到的效果就像qq邮箱那样,回退不刷新页面,只回到页面上之前的操作
张运领 2014-03-21
  • 打赏
  • 举报
回复
这个应该是不行操作的吧,前端的代码只是在这个浏览器的平台进行运行 理论上,这些东西是不能改变平台的一些操作的 不过可以进行一个提示
window.onbeforeunload = function(){
	console.log("leave this page!");
	return false;
}
这样可以监听卸载当前页面的事件,如果向前返回的话,就会触发这个事件,这里只是会提示出,是否要离开,只能做到引导用户不要离开,不能限制说,不能离开当前页面。

87,910

社区成员

发帖
与我相关
我的任务
社区描述
Web 开发 JavaScript
社区管理员
  • JavaScript
  • 无·法
加入社区
  • 近7日
  • 近30日
  • 至今
社区公告
暂无公告

试试用AI创作助手写篇文章吧