文档章节

禁用浏览器后退按钮

张悟空
 张悟空
发布于 2015/02/27 19:52
字数 1559
阅读 2389
收藏 12

基本上是3个solution:

1).设置网页过期(服务器端)

2).javascript:window.history(客户端)

3).对于键盘的backspace.通过window.event来过滤,当然要考虑的是对于Input控件,要保持删除的功能。

<script type="text/javascript">

function backspace() {

if (event.keyCode == 8 && event.srcElement.tagName != "INPUT" && event.srcElement.type != "text")

            event.returnValue = false;

     }

if (navigator.appName == "Microsoft Internet Explorer") {

         window.history.forward(1);

     }

else // if it is Mozilla than

     {

         window.history.forward(-1);

     }    

</script>

下面是我的尝试:

1) 先来说对于,网页过期的:

网页一旦过期,意味着每次页面的刷新,需要重新从服务器端获取所有的网页资源。这时候如果通过浏览器的后退按钮,进行后退,就会reload整个页面,相当于一个get request.因此对于相应页面会执行 OnLoad事件,以及OnLoadCompleted事件

若在OnLoadCompleted事件页面没能获取到所需要的资源,将会显示网页已过期的错误。但是无论讲*****怎样添加到页面中,都不能重现网页已过期的错误,

2) 对于页面可客户端的OnLoad执行脚本: Windows.History.Forward(1),对于这个方法别人说不完美,但没有说处理理由。我相说的是,对于直接点击后腿按钮的情况,Window.History.Forward(1)几乎可以Cover 大多数场景,只是一个奇怪的事情当所有的后退经过一个页面的时候,就会停止,不会继续forward 到原来页面。原以为这就是我们的解决500 errors的钥匙,但是一次不经意的聊天,让我们想起了,如果不是点击后腿按钮,而是选择HIstory List中网页,又该如何去处理? 为了解决这一问题,我有2个想法

a)获取选择HistoryList中页面的index,然后Windows.History.Froward(index), 查阅资料,最后在msdn上看到的解释是,处于安全的因素microsoft 不会暴露Window.history对象中url 实际地址和Index,也就是说无法得到HistoryList 网页的具体信息。

b)  记录后退之前页面的URL,然后直接用Windows.Location.Href,记录后退之前的url这个不难,<%= %> <%#%>, 均可做到,但是问题来了,如何区分网页的get reque是由于后退造成的,似乎有一个无解! 

不过在探索a,b 的时候,想到2个问题

1)关于Windows..history.forward();如果windows.history List中只有5个页面,但是我把Windows..history.forward(100),结果会是如何。

2)如果我在history list选择一个距离当前页面距离不是1的页面 Windows..history.forward(1),会如何工作?

解释:

   1)其实Windows..history.forward(100)和Windows..history.forward(1)的效果是一样的.

   那Windows..history.forward(1),究竟是如何工作的,通过http watch

wps_clip_image-11801

可以看到,Windows..history.forward(1),总是会将windows.history.list里买你的所有页面走完,直到页面再也不能往前,对于windows.history.list.length=5的时候,无论在哪个页面发起history,forward(1),都会走到当前页面。因此是可以很好地阻止页面后退,缺点是带来了很多的额外的http request,因为需要一个页面一个页面后退。

另外一个奇怪的问题:在我们的一个application里面我发现,windows.history.forward(1),会走到某个页面,停止。以至于在那个页面之后的页面,就无法实现组织后退的功能。我偶然发现对于windows.history.forward(1)页面居然会执行OnInit ,Onload ,OnloadComplete这些事件,我很费解,为什么windows.history.forward会触发服务器端事件呢,然来是因为在基类里面设置了缓存过期,这样每次需要从server上取页面资源 。

因此页面过期和windows.history.forward是不可以一起使用的



为解决浏览器后退按钮禁用的方法,在网上搜索了几个方法,虽然可用但是没有太完美的...

1、

<script language="JavaScript">

   

         javascript:window.history.forward(1); //我目前先用着这个

</script>

利用JS产生一个“前进”的动作,以抵消后退功能,这种方法应该是最简洁的,并且不需要考虑用户连点两次或多次“后退”的情况,缺点是当用户端禁用了JavaScript之后即失效。

2、

<A HREF="logout.do" onclick="javascript:location.replace(this.href); event.returnValue=false; ">       

Logout (Back Disabled)

</A>

这种方法用链接页面的URL替换了当前的历史纪录,这样浏览历史记录中就不会有本页面,后退按钮将不能回到本页面。用户点击“Logout”链接注销并执行新页面,这时当用户点击“后退”按钮将不能回到本页,而是回到在本页之前打开的那个页面。

也就是说,这种方法清除的是最后一个访问历史记录,而不是全部的访问记录,这是该方法的一个缺点,当然可以在每一个业务页面都添加这段代码作为保护。另外,和上一种方法相同,当用户端禁用了JavaScript之后即失效。

3、

<script language="JavaScript">

  

function logout()

{

    window.close(true);

    window.open("logout.do");

}

</script>

<button onClick="logout()">Logout</button>

这种方法比较偷懒,关掉浏览器再重新开,经过我的测试在视觉上几乎感觉不出来延时,同时又保证了后退按钮不可用(新窗口浏览器后退按钮为灰色),看起来似乎是个好方法,但缺点也比较明显:

首先,关闭和重开的浏览器窗口大小可能不同,用户可以明显看出这一过程,并且在一定程度上影响操作。

其次,同上,这是一个JavaScript方法。

以上方法都是针对“后退”按钮作出的反应,客户端浏览器需要打开JavaScript代码,下面尝试从另一角度来解决这一问题:

4、禁止缓存

<%

        response.setHeader("Cache-Control", "no-cache");

       

        response.setHeader("Cache-Control", "no-store");

       

        response.setDateHeader("Expires", 0);

       

        response.setHeader("Pragma", "no-cache");

%>

这种方法使用服务器端脚本,强制浏览器重新访问服务器下载页面,而不从缓存读取,结合struts jsp页面中的<logic>标签实现重新定向。

以上各种方法都有一定的局限,虽然是一个小问题,可是考虑到页面安全的因素,却不得不重视。

本文转载自:http://www.cnblogs.com/subway-2008/archive/2011/10/11/2208008.html

张悟空

张悟空

粉丝 8
博文 71
码字总数 20588
作品 0
郑州
程序员
私信 提问
JSP 防止网页刷新重复提交数据

网页如何防止刷新重复提交与如何防止后退的解决方法 提交后禁用提交按钮(大部分人都是这样做的) 如果客户提交后,按F5刷新怎么办? 使用Session 在提交的页面也就是数据库处理之前: if ses...

长平狐
2013/01/06
5.8K
0
[html]history禁用浏览器的后退功能(包括其他操作后退的按钮,操作等)

前端在编写代码的时候可能会使用到禁用浏览器的后退功能,为使后退功能更加的完善,所以需要禁用掉很多的其他操作,比如键盘的按钮,组合快捷键等等。 这里是一段关于js完全禁用浏览器后退的...

唐门没有糖
2018/08/22
0
0
怎样控制浏览器左上后退按钮事件?

页面描述:初始进入是一个a.jsp,动态控制某条件下页面会刷新为b.jsp 目的:控制页面,禁止后退 处理:禁用了页面右键(快捷键等),设置页面是弹窗_blank(无工具栏,无后退、前进按钮); ...

大喵子
2016/01/11
309
1
jquery中禁止浏览器使用前进后退按钮

在某些业务场景下需要对浏览器的前进后退按钮进行禁用,如锁屏等等。可加入如下jquery代码。

Jim_Ai
2016/05/09
561
0
有没有办法 禁用浏览器的刷新后退按钮 ? 语言:php js。

有没有办法 禁用浏览器的刷新后退按钮 ? 语言:php js。 找了好久了,没有方案

卜卜亍
2014/05/08
918
5

没有更多内容

加载失败,请刷新页面

加载更多

用原生js对表格排序

本文转载于:专业的前端网站➸用原生js对表格排序 阿里的模拟笔试题,当时时间有限没写出来,其实是因为自己对原生dom操作不熟悉,这里补一下。 题目的大意是有一个表格,如代码所示 <table>...

前端老手
23分钟前
3
0
IT兄弟连 HTML5教程 HTML5表单 HTML5新增表单元素

HTML5有一些新的表单元素:<datalist>、<keygen>、<output>。不是所有的浏览器都支持HTML5新的表单元素,但即使浏览器不支持该表单属性,仍然可以显示为常规的表单元素。 1 <datalist>元素 ...

老码农的一亩三分地
24分钟前
3
0
【朝花夕拾】Android自定义View篇之(一)View绘制流程

https://www.cnblogs.com/andy-songwei/p/10955062.html

shzwork
26分钟前
4
0
Qt编写自定义控件70-扁平化flatui

一、前言 对于现在做前端开发人员来说,FlatUI肯定不陌生,最近几年扁平化的设计越来越流行,大概由于现在PC端和移动端的设备的分辨率越来越高,扁平化反而看起来更让人愉悦,而通过渐变色产...

飞扬青云
36分钟前
2
0
教你玩转Linux—添加批量用户

添加和删除用户对每位Linux系统管理员都是轻而易举的事,比较棘手的是如果要添加几十个、上百个甚至上千个用户时,我们不太可能还使用useradd一个一个地添加,必然要找一种简便的创建大量用户...

Linux就该这么学
今天
6
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部