利用js实现 禁用浏览器后退
现在很多的内部系统,一些界面,都是用户手动点击退出按钮的。但是为了避免,用户误操作 点击浏览器后退,或者用鼠标手势后退什么的。容易出现误操作。
所以在有些页面上,适当的禁用浏览器的后退,是可以提高很大的用户体验。
在网上查,可以查到很多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实现 禁用浏览器后退的更多相关文章
- 利用js实现禁用浏览器后退
原博主链接为:http://blog.csdn.net/zc474235918/article/details/53138553 现在很多的内部系统,一些界面,都是用户手动点击退出按钮的.但是为了避免 ...
- 利用js实现 禁用浏览器后退 浏览器返回
现在很多的内部系统,一些界面,都是用户手动点击退出按钮的.但是为了避免,用户误操作 点击浏览器后退,或者用鼠标手势后退什么的.容易出现误操作. 所以在有些页面上,适当的禁用浏览器的后退, ...
- [转] 利用js实现 禁用浏览器后退
[From] http://blog.csdn.net/zc474235918/article/details/53138553 现在很多的内部系统,一些界面,都是用户手动点击退出按钮的.但是为了避免 ...
- 利用js实现 禁用浏览器后退| 去除上一个历史记录链接
也是查找了好多资料才找到的,这种方式,可以消除 后退的所有动作.包括 键盘.鼠标手势等产生的后退动作. <script language="javascript"> / ...
- javascript怎么禁用浏览器后退按钮
1. <script language="JavaScript"> javascript:window.history.forward(1); </scri ...
- js禁用浏览器后退
history.pushState(null, null, document.URL); window.addEventListener('popstate', function () { histo ...
- ASP.NET实现IE下禁用浏览器后退按钮办法
在page_load方法里面增加如下代码: Response.Buffer = true; Response.ExpiresAbsolute = DateTime.Parse("2010-1 ...
- JS如何禁用浏览器的退格键
<script type="text/javascript"> //处理键盘事件 禁止后退键(Backspace)密码或单行.多行文本框除外 function forb ...
- 关于如何利用js判断IE浏览器各种版本问题
<!--[if IE 6]> IE 浏览器版本 6 <![endif]--> <!--[if IE 7]> IE 浏览器版本 7 <![endif]--& ...
随机推荐
- SQLServer版本
- Spring Security 访问控制 源码解析
上篇 Spring Security 登录校验 源码解析 分析了使用Spring Security时用户登录时验证并返回token过程,本篇分析下用户带token访问时,如何验证用户登录状态及权限问 ...
- Python菜鸟快乐游戏编程_pygame(1)
Python菜鸟快乐游戏编程_pygame(博主录制,2K分辨率,超高清) https://study.163.com/course/courseMain.htm?courseId=100618802 ...
- .Net Core配置文件介绍
Net Core中的配置文件介绍 1 简单回顾.Net Framework配置文件 .Net Core中的配置文件操作较.Net Framework有了很大的改动.介绍.Net Core中配置文件操作 ...
- [Leetcode] 01 Matrix
问题: https://leetcode.com/problems/01-matrix/#/description 基本思路:广度优先遍历,根据所有最短距离为N的格找到所有距离为N+1的格,直到所有的 ...
- python之路(3)函数和匿名函数
函数 函数与过程 过程 def test(): "注释" print('1 am chen') test() : 过程调用 def : 定义函数的关键字 test : 函数名 pr ...
- DUMP 5 企业级电商项目
[订单模块] 创建订单 商品信息 订单列表 订单详情 取消订单 订单列表 订单搜素 订单详情 订单发货 [创建订单] 购物车勾选商品 涉及 Cart Product => 一个商品 ...
- Linux VPS通过安装CPULimit来限制CPU使用率
说明:我们手上经常有很多廉价的VPS,有时候使用某些软件应用的时候,会出现CPU跑满的情况,而长时间跑满会被VPS商家停掉,所以这里我们需要想办法来限制进程CPU使用率,这里就说个教程. 简介 cpu ...
- echarts笔记
常见问题: 1.x轴和y轴type同时为category时不可行 只能改变方式显示,返回不同名称,如加上百分比显示 formatter:"value%"; var waterLev ...
- es过滤集提升权重
es { "query":{ "function_score":{ "query":{ "match":{ " ...