如何禁用浏览器的后退按钮(跨浏览器)?
禁用浏览器的后退按钮
不要禁用预期的浏览器行为。
让您的页面处理用户返回一两页的可能性;不要试图削弱他们的软件。
我想出了一个使用 JavaScript 禁用后退按钮的小技巧。我在 chrome 10、firefox 3.6 和 IE9 上检查过:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<title>Untitled Page</title>
<script type = "text/javascript" >
function changeHashOnLoad() {
window.location.href += "#";
setTimeout("changeHashAgain()", "50");
}
function changeHashAgain() {
window.location.href += "1";
}
var storedHash = window.location.hash;
window.setInterval(function () {
if (window.location.hash != storedHash) {
window.location.hash = storedHash;
}
}, 50);
</script>
</head>
<body onload="changeHashOnLoad(); ">
Try to hit the back button!
</body>
</html>
它在做什么?
来自评论:
该脚本利用了浏览器将 URL 中“#”符号后面的任何内容视为浏览历史记录的一部分这一事实。它的作用是这样的:当页面加载时,“#1”被添加到 URL 中。50 毫秒后,“1”被删除。当用户单击“返回”时,浏览器会将 URL 更改回删除“1”之前的 URL,但是 - 这是同一个网页,因此浏览器不需要重新加载页面。– 约西·沙绍
其他人采取的方法说“不要这样做”,但这并没有真正回答海报的问题。让我们假设每个人都知道这是一个坏主意,但我们仍然很好奇它是如何完成的......
您不能禁用用户浏览器上的后退按钮,但您可以设置它以便您的应用程序在用户返回时中断(显示错误消息,要求用户重新开始)。
我见过的一种方法是在应用程序中的每个 URL 和每个表单中传递一个令牌。令牌会在每个页面上重新生成,一旦用户加载新页面,之前页面中的所有令牌都会失效。
当用户加载页面时,该页面只会显示是否将正确的令牌(已提供给上一页上的所有链接/表单)传递给它。
我的银行提供的网上银行应用程序是这样的。如果您完全使用后退按钮,则不再有链接可用,也无法重新加载页面——相反,您会看到一条通知,告诉您无法返回,必须重新开始。
这个问题是非常相似,这一个...
您需要强制缓存过期才能使其工作。将以下代码放在您的页面代码后面。
Page.Response.Cache.SetCacheability(HttpCacheability.NoCache)
当我自己寻找答案时,“最佳实践”是......过时......就像浏览器一样。(真的浏览器是丑陋的化石)
最好/最安全的解决方案是让浏览器实现一个方法/请求,用户可以在其中授予页面控制界面的能力。
为什么?因为对于我当前的项目,我正在构建一个 100% 由 JavaScript 构建和控制的界面..并且后退按钮在我的项目中没有位置,因为没有页面更改。(即,速度非常快,并且由于刷新而没有页面闪烁。就像真正的应用程序一样!)
我知道为什么没有“劫持”界面的能力,我也理解。但至少我们应该有能力从浏览器请求它!现在这将真正成为没有劫持危险的“最佳实践”。
但是浏览器就是浏览器......我不希望在这方面发生任何事情。