87,910
社区成员
发帖
与我相关
我的任务
分享
<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
window.onbeforeunload = function(){
console.log("leave this page!");
return false;
}
这样可以监听卸载当前页面的事件,如果向前返回的话,就会触发这个事件,这里只是会提示出,是否要离开,只能做到引导用户不要离开,不能限制说,不能离开当前页面。