禁用浏览器的后退按钮

浏览器的后退按钮使得我们能够方便地返回以前访问过的页面，它无疑非常有用。但有时候我们不得不关闭这个功能，以防止用户打乱预定的页面访问次序。本文介绍网络上可找到的各种禁用浏览器后退按钮方案，分析它们各自的优缺点和适用场合。
一、概述
　　曾经有许多人问起，“怎样才能‘禁用’浏览器的后退按钮？”，或者“怎样才能防止用户点击后退按钮返回以前浏览过的页面？”我访问了许多网站，参考了这些网站所介绍的各种实现方法。如果你经常访问ASP编程网站，本文所介绍的部分内容你可能已经见到过。本文的任务是把各种可能的方法都介绍给大家，然后找出最好的方法！
二、禁止缓存
　　在我找到的许多方案中，其中有一种建议禁止页面缓存。具体是使用服务器端脚本，如下所示：
<%
Response.Buffer = True
Response.ExpiresAbsolute = Now() - 1
Response.Expires = 0
Response.CacheControl = "no-cache"
%>
　　这种方法非常有效！它强制浏览器重新访问服务器下载页面，而不是从缓存读取页面。使用这种方法时，编程者的主要任务是创建一个会话级的变量，通过这个变量确定用户是否仍旧可以查看那个不适合通过后退按钮访问的页面。由于浏览器不再缓存这个页面，当用户点击后退按钮时浏览器将重新下载该页面，此时程序就可以检查那个会话变量，看看是否应该允许用户打开这个页面。
　　例如，假设我们有如下表单：
<%
Response.Buffer = True
Response.ExpiresAbsolute = Now() - 1
Response.Expires = 0
Response.CacheControl = "no-cache"
If Len(Session("FirstTimeToPage")) > 0 then
"用户已经访问过当前页面，现在是再次返回访问。
"清除会话变量，将用户重定向到登录页面。
Session("FirstTimeToPage") = ""
Response.Redirect "/Bar.asp"
Response.End
End If
"如果程序运行到这里，说明用户能够查看当前页面
"以下开始创建表单
%>
<form method=post action="SomePage.asp">
<input type=submit>
</form>
　　我们借助会话变量FirstTimeToPage检查用户是否是第一次访问当前页面。如果不是第一次（即 Session("FirstTimeToPage")包含某个值），那么我们就清除会话变量的值，然后把用户重新定向到一个开始页面。这样，当表单提交时（此时SompePage.asp被打开），我们必须赋予FirstTimeToPage一个值。即，在SomePage.asp中我们需要加上下面的代码：
Session("FirstTimeToPage") = "NO"
　　这样，已经打开SomePage.asp的用户如果点击后退按钮，浏览器将重新请求服务器下载页面，服务器检查到 Session("FirstTimeToPage")包含了一个值，于是就清除Session("FirstTimeToPage")，并把用户重定向到其他页面。当然，所有这一切都需要用户启用了Cookie，否则会话变量将是无效的。
　　另外，我们也可以用客户端代码使浏览器不再缓存Web页面：
<html>
<head>
<meta http-equiv="Expires" CONTENT="0">
<meta http-equiv="Cache-Control" CONTENT="no-cache">
<meta http-equiv="Pragma" CONTENT="no-cache">
</head>
　　如果使用上面的方法强制浏览器不再缓存Web页面，必须注意以下几点：
只有在使用安全连接时“Pragma: no-cache”才防止浏览器缓存页面。对于不受安全保护的页面，“Pragma: no-cache”被视为与“Expires: -1”相同，此时浏览器仍旧缓存页面，但把页面标记为立即过期。
在IE 4或5中，“Cache-Control”META HTTP-EQUIV标记将被忽略，不起作用。
　　在实际应用中我们可以加上所有这些代码。然而，由于这种方法不能适用于所有的浏览器，所以是不推荐使用的。但如果是在Intranet环境下，管理员可以控制用户使用哪种浏览器，我想还是有人会使用这种方法。
三、其他方法
　　接下来我们要讨论的方法以后退按钮本身为中心，而不是浏览器缓存。这儿有一篇文章Rewiring the Back Button很值得参考。不过我注意到，如果使用这种方法，虽然用户点击一下后退按钮时他不会看到以前输入数据的页面，但只要点击两次就可以，这可不是我们希望的

效果，因为很多时候，固执的用户总是能够找到绕过预防措施的办法。
　　另外一种禁用后退按钮的办法是用客户端javascript打开一个没有工具条的窗口，这使得用户很难返回前一页面，但不是不可能。一种更安全但相当恼人的方法是，当表单提交时打开一个新的窗口，与此同时关闭表单所在的窗口。但我觉得这种方法不值得认真考虑，因为我

们总不能让用户每提交一个表单就打开一个新窗口。
　　那么，在那个我们不想让用户返回的页面是否也可以加入javascript代码呢？在这个页面中加入的javascript代码可用来产生点击前进按钮的效果，这样也就抵消了用户点击后退按钮所产生的动作。用于实现该功能的javascript代码如下所示：
<script language="javascript">

</script>
　　同样地，这种方法虽然有效，但距离“最好的方法”还差得很远。后来我又看到有人建议用location.replace从一个页面转到另一个页面。这种方法的原理是，用新页面的URL替换当前的历史纪录，这样浏览历史记录中就只有一个页面，后退按钮永远不会变为可用。我想这可能正是许多人所寻求的方法，但这种方法仍旧不是任何情况下的最好方法。使用这种方法的实例如下所示：
<A HREF="PageName.htm" οnclick="javascript:location.replace(this.href); event.returnvalue=false; ">
禁止后退到本页面的链接
　　试试下面这个链接：
　　禁止后退到本页面的链接！
　　这种方法的缺点在于：简单地运用Response.Redirect将不再有效，这是因为每次用户从一个页面转到另一个页面，我们都必须用客户端代码清除 location.history。另外还要注意，这种方法清除的是最后一个访问历史记录，而不是全部的访问记录。
　　点击上面的链接，你将打开一个简单的HTML页面。再点击后退按钮，你可以看到这时打开的不是本页面，而是本页面之前的页面！（当然，你必须在浏览器中启用了客户端javascript代码。）
　　经过一番仔细的寻寻觅觅之后最好的方案应该是：混合运用客户端脚本和服务器端脚本。

禁用浏览器的后退按钮相关推荐

[html]history禁用浏览器的后退功能（包括其他操作后退的按钮，操作等）
前端在编写代码的时候可能会使用到禁用浏览器的后退功能,为使后退功能更加的完善,所以需要禁用掉很多的其他操作,比如键盘的按钮,组合快捷键等等. 这里是一段关于js完全禁用浏览器后退的功能. <sc ...
Jquery 禁用浏览器的后退和前进按钮
使用js,Jquery 禁用浏览器的back 和 next 按钮: 有时为了防治用户乱了访问顺序,不得不禁掉浏览器的前进后退按钮. jQuery(document).ready(function () ...
手机浏览器利用js实现禁用浏览器后退
利用js实现禁用浏览器后退现在很多的内部系统,一些界面,都是用户手动点击退出按钮的.但是为了避免,用户误操作点击浏览器后退,或者用鼠标手势后退什么的.容易出现误操作. 所以在有些页面上,适当的禁 ...
angular5监听浏览器的前进和后退按钮(PlatformLocation)
今天遇到一个测试提出一个BUG,点击一个按钮会出现一个弹窗,然后点击浏览器的后退按钮,发现弹窗消失了,但是灰色蒙版还在,导致列表页面还是灰色的并且不可操作! angular提供了可以监听浏览器前进和后 ...
vue 禁止显示本网页由、、_【VUE/JS】vue和js禁止浏览器页面后退
1.vue 禁止浏览器后退需求是:需要某个路由不能通过浏览器返回,同时不影响相互之间的切换整理一下解决方法和使用方法: 1.在路由配置中给这个路由添加meta信息,比如: { path: '/ ...
浏览器前进后退静默刷新页面
浏览器前进后退静默刷新页面开发过程中总会遇到一些浏览器返回.前进和前进后退静默刷新页面,使得每次进页面获取到的数据都是最新的,但用户体验又比较好的体验. 这里整理一些常用的js操作方式: windo ...
IE后退按钮过期原因
我们为了让客户端每次访问服务器都得到的是最新的页面,一般会禁止客户端的缓存,但是有时候使用IE的后退按钮,IE不会自动向服务器提交请求,而是显示一个提示页面过期的警告页面:警告: 网页已经过期您申请 ...
关于页面之间传参时有空格,中文及点击页面后退按钮的问题
今天心情不错,解决了一些小bug,然后要进行下小总结了..... 首先说这页面间传参,有时传的参数是带有空格的比如一小部分sql语句,怎么办呢? 两种解决方案:1.当进行form表单提交时,用隐藏术 ...
javascript怎么禁用浏览器后退按钮
1. 复制代码代码如下: <script language="JavaScript"> javascript:window.history.forward(1); & ...
vue中使用，js禁用浏览器后退按钮
* js禁用浏览器后退按钮 * vue中使用*/ methods:{goBack(){history.pushState(null,null,document.URL);}, } destroyed( ...

禁用浏览器的后退按钮

禁用浏览器的后退按钮相关推荐

最新文章

热门文章