想问一下怎么截获浏览器的回退动作

想问一下如何截获浏览器的回退动作
问题如上，我想在按浏览器的返回箭头时，不让浏览器换页，怎么用做到，并获取用户的这次事件
------解决方案--------------------
这个应该是不行操作的吧，前端的代码只是在这个浏览器的平台进行运行

理论上，这些东西是不能改变平台的一些操作的

不过可以进行一个提示

window.onbeforeunload = function(){

	console.log("leave this page!");

	return false;

}

这样可以监听卸载当前页面的事件，如果向前返回的话，就会触发这个事件，这里只是会提示出，是否要离开，只能做到引导用户不要离开，不能限制说，不能离开当前页面。
------解决方案--------------------
同意楼上，不建议改变浏览器的这些行为，特别是不通知用户的前提下，这样改变了用户的使用习惯，会对用户产生不必要的困惑。

但是也提供另外一种方法，可以考虑用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

------解决方案--------------------
可以试试 unload 事件，就是和 window.load() 相反的那个，具体我也不清楚。
------解决方案--------------------
window.onpopstate = function () {
//do something ..
}

html5 可以监听每次地址更换。如果是旧游览器你可以用 # ，监听hash change event

想问一下怎么截获浏览器的回退动作

相关推荐