现在很多的内部系统,一些界面,都是用户手动点击退出按钮的。但是为了避免,用户误操作 点击浏览器后退,或者用鼠标手势后退什么的。容易出现误操作。
       所以在有些页面上,适当的禁用浏览器的后退,是可以提高很大的用户体验。
       在网上查,可以查到很多js禁用后退的材料。

用的多的方法如下:

1、回退后,产生一个前进事件。
       这种方式,不算是一个满意的解决方式。因为用户能体验到,界面的后退,前进。体验不好。

<script language="JavaScript">
javascript:window.history.forward();
</script>

2、禁用键盘的backspace键

这种做法,没有办法消除鼠标的误操作

<script type="text/javascript"> 

//处理键盘事件 禁止后退键(Backspace)密码或单行、多行文本框除外
function banBackSpace(e){
var ev = e || window.event;//获取event对象
var obj = ev.target || ev.srcElement;//获取事件源 var t = obj.type || obj.getAttribute('type');//获取事件源类型 //获取作为判断条件的事件类型
var vReadOnly = obj.getAttribute('readonly');
var vEnabled = obj.getAttribute('enabled');
//处理null值情况
vReadOnly = (vReadOnly == null) ? false : vReadOnly;
vEnabled = (vEnabled == null) ? true : vEnabled; //当敲Backspace键时,事件源类型为密码或单行、多行文本的,
//并且readonly属性为true或enabled属性为false的,则退格键失效
var flag1=(ev.keyCode == 8 && (t=="password" || t=="text" || t=="textarea")
&& (vReadOnly==true || vEnabled!=true))?true:false; //当敲Backspace键时,事件源类型非密码或单行、多行文本的,则退格键失效
var flag2=(ev.keyCode == 8 && t != "password" && t != "text" && t != "textarea")
?true:false; //判断
if(flag2){
return false;
}
if(flag1){
return false;
}
} //禁止后退键 作用于Firefox、Opera
document.onkeypress=banBackSpace;
//禁止后退键 作用于IE、Chrome
document.onkeydown=banBackSpace; </script> ---------------------
作者:赵崇
来源:CSDN
原文:https://blog.csdn.net/zc474235918/article/details/53138553
版权声明:本文为博主原创文章,转载请附上博文链接!

3、终极方案:

也是查找了好多资料才找到的,这种方式,可以消除 后退的所有动作。包括 键盘、鼠标手势等产生的后退动作。

    <script language="javascript">
//防止页面后退
history.pushState(null, null, document.URL);
window.addEventListener('popstate', function () {
history.pushState(null, null, document.URL);
});
</script> ---------------------
作者:赵崇
来源:CSDN
原文:https://blog.csdn.net/zc474235918/article/details/53138553
版权声明:本文为博主原创文章,转载请附上博文链接!

现在,我们项目中就使用了第三种方式。在常用浏览器中,都可以禁用了后退。

---------------------
作者:赵崇
来源:CSDN
原文:https://blog.csdn.net/zc474235918/article/details/53138553
版权声明:本文为博主原创文章,转载请附上博文链接!

												

利用js实现 禁用浏览器后退的更多相关文章

  1. 利用js实现禁用浏览器后退

    原博主链接为:http://blog.csdn.net/zc474235918/article/details/53138553 现在很多的内部系统,一些界面,都是用户手动点击退出按钮的.但是为了避免 ...

  2. 利用js实现 禁用浏览器后退 浏览器返回

    现在很多的内部系统,一些界面,都是用户手动点击退出按钮的.但是为了避免,用户误操作 点击浏览器后退,或者用鼠标手势后退什么的.容易出现误操作.        所以在有些页面上,适当的禁用浏览器的后退, ...

  3. [转] 利用js实现 禁用浏览器后退

    [From] http://blog.csdn.net/zc474235918/article/details/53138553 现在很多的内部系统,一些界面,都是用户手动点击退出按钮的.但是为了避免 ...

  4. 利用js实现 禁用浏览器后退| 去除上一个历史记录链接

    也是查找了好多资料才找到的,这种方式,可以消除 后退的所有动作.包括 键盘.鼠标手势等产生的后退动作. <script language="javascript"> / ...

  5. javascript怎么禁用浏览器后退按钮

    1. <script language="JavaScript">    javascript:window.history.forward(1); </scri ...

  6. js禁用浏览器后退

    history.pushState(null, null, document.URL); window.addEventListener('popstate', function () { histo ...

  7. ASP.NET实现IE下禁用浏览器后退按钮办法

    在page_load方法里面增加如下代码: Response.Buffer = true; Response.ExpiresAbsolute = DateTime.Parse("2010-1 ...

  8. JS如何禁用浏览器的退格键

    <script type="text/javascript"> //处理键盘事件 禁止后退键(Backspace)密码或单行.多行文本框除外 function forb ...

  9. 关于如何利用js判断IE浏览器各种版本问题

    <!--[if IE 6]> IE 浏览器版本 6 <![endif]-->   <!--[if IE 7]> IE 浏览器版本 7 <![endif]--& ...

随机推荐

  1. Go package(1) time 用法

    golang使用的版本: go version go1.10.3 一:功能介绍 time的一些功能,比如时区,像linux中的定时器,时间计算等 格式化时间 时区(Location) 时间计算 Tic ...

  2. 基于Redis的分布式锁真的安全吗?

    说明: 我前段时间写了一篇用consul实现分布式锁,感觉理解的也不是很好,直到我看到了这2篇写分布式锁的讨论,真的是很佩服作者严谨的态度, 把这种分布式锁研究的这么透彻,作者这种技术态度真的值得我好 ...

  3. markdown 【demo】

    第一次开始 用markdown 编辑器 public class{ public static void main (String[] agrs){ System.out.println(" ...

  4. hadoop记录-hadoop常用

    1.hdfs目录配额 #设置配额目录hdfs dfsadmin -setSpaceQuota 10T /user/hive/warehouser/tmp查看配额目录信息hdfs dfs -count ...

  5. [算法竞赛入门经典]Ancient Cipher, NEERC 2004,UVa1339

    Description Ancient Roman empire had a strong government system with various departments, including ...

  6. Linux ip配置

    ifconfig  查看ip ifconfig eth0  192.168.100.10  netmask 255.255.255.0  或者 ifconfig eth0  192.168.100.1 ...

  7. count

    select deptno as 部门,count(*) as 人数from emp group by deptno;  --统计各个部门的人数

  8. Codeforces Round #551 (Div. 2) D. Serval and Rooted Tree (树形dp)

    题目链接 题意:给你一个有根树,假设有k个叶子节点,你可以给每个叶子节点编个号,要求编号不重复且在1-k以内.然后根据节点的max,minmax,minmax,min信息更新节点的值,要求根节点的值最 ...

  9. JAVA进阶20

    1.可视化日历程序(简陋版) package cn.zh.abstrac; import java.text.DateFormat; import java.text.ParseException; ...

  10. Angular_上拉刷新

    1.先不做上拉触发,用button模拟一下,触发函数 export class StudyComponent implements OnInit { /*列表数据流 */ list$: Observa ...