前端javascript如何阻止按下退格键页面回退 但 不阻止文本框使用退格键删除文本
这段代码可以:
document.onkeydown = function (e) {
e.stopPropagation(); // 阻止事件冒泡传递
e.preventDefault(); // 阻止浏览器默认事件的发生
// your code
if (e.keyCode == ) { // keyCode == 8 表示按下的回退按钮
}
}
下面更正一下,上面的写法有一个比较严重的问题:
这种写法虽然屏蔽了回车键页面回退的功能,但同样,如果该页面有文本输入框,那么这个输入框将不能使用 退格键 进行文本删除;
下面给出一种网上搜索的 既能屏蔽页面退格键回退 ,又不屏蔽 退格键删除 功能的代码,感谢网上盆友的分享,因为有好几个博客都能找到同一段代码,所以无法确定谁是原创:
<script type="text/javascript">
//处理键盘事件 禁止后退键(Backspace)密码或单行、多行文本框除外
function forbidBackSpace(e) {
var ev = e || window.event; //获取event对象
var obj = ev.target || ev.srcElement; //获取事件源
var t = obj.type || obj.getAttribute('type'); //获取事件源类型
//获取作为判断条件的事件类型
var vReadOnly = obj.readOnly;
var vDisabled = obj.disabled;
//处理undefined值情况
vReadOnly = (vReadOnly == undefined) ? false : vReadOnly;
vDisabled = (vDisabled == undefined) ? true : vDisabled;
//当敲Backspace键时,事件源类型为密码或单行、多行文本的,
//并且readOnly属性为true或disabled属性为true的,则退格键失效
var flag1 = ev.keyCode == && (t == "password" || t == "text" || t == "textarea") && (vReadOnly == true || vDisabled == true);
//当敲Backspace键时,事件源类型非密码或单行、多行文本的,则退格键失效
var flag2 = ev.keyCode == && !(t == "password" && t == "text" && t == "textarea");
//判断
if (flag2 || flag1) return false;
}
//禁止后退键 作用于Firefox、Opera
document.onkeypress = forbidBackSpace;
//禁止后退键 作用于IE、Chrome
document.onkeydown = forbidBackSpace;
</script>
前端javascript如何阻止按下退格键页面回退 但 不阻止文本框使用退格键删除文本的更多相关文章
- javascript当文本框获得焦点设置边框
javascript当文本框获得焦点设置边框:本章节介绍一下当文本框获得焦点以后如何设置文本框的边框样式,本来是一个非常简单的问题,但是有可能前台美工人员对javascript并不是太了解,所以还是通 ...
- 使用Javascript限制文本框只允许输入数字
很多时候需要用到限制文本框的数字输入,试过许多方法,都不太理想,遂决定自己实现一个来玩玩.曾经使用过的方法通过onkeydown事件来控制只允许数字: <input onkeydown=&quo ...
- JavaScript文本框焦点事件
效果图如下: <!-- 当文本框获得焦点时候,如果文本框内容是 请输入搜索关键字 清空文本框,输入内容变黑色 --> <!-- 当文本框失去焦点时候,如果文本框无内容,则添加灰色的 ...
- javascript实现自动添加文本框功能
转自:http://www.cnblogs.com/damonlan/archive/2011/08/03/2126046.html 昨天,我们公司的网络小组决定为公司做一个内部的网站,主要是为员工比 ...
- Web前端-JavaScript基础教程下
Web前端-JavaScript基础教程下 <script>有6个属性: async对外部脚本有效,可以用来异步操作,下载东西,不妨碍其他操作. charset为src属性指定字符集. d ...
- JavaScript 多级联动浮动(下拉)菜单 (第二版)
JavaScript 多级联动浮动(下拉)菜单 (第二版) 上一个版本(第一版请看这里)基本实现了多级联动和浮动菜单的功能,但效果不是太好,使用麻烦还有些bug,实用性不高.这次除了修改已发现的问 ...
- Web前端-JavaScript基础教程上
Web前端-JavaScript基础教程 将放入菜单栏中,便于阅读! JavaScript是web前端开发的编程语言,大多数网站都使用到了JavaScript,所以我们要进行学习,JavaScript ...
- JavaWeb前端: JavaScript 简介
JavaScript基本概念 什么是JavaScript JS是运行在浏览器里的解释性语言,能实现浏览器端和用户的直接交互(HTML输出/响应事件/改变HTML内容图像样式):除了变量不区分类型以外, ...
- 实例演示 kino.razor (前端 Javascript 模板工具,Razor 风格)的使用
前言 对于习惯了 ASP.NET MVC Razor 模板引擎的人来说,比如我,一直在寻找前端 Javascript 端的 Razor 模板工具.这之前,我也了解到很多Javascript 端的模板工 ...
随机推荐
- phpstorm 下载以及安装
phpstorm都知道编写php代码比较高效,这里不多说. 关键是用它就要破解,毕竟不想花钱买,在网上找了好多方法,怎么尝试都不管用,后来我只是把版本替换为2017.1(最新版才是2017.3,版本差 ...
- 『zkw线段树及其简单运用』
阅读本文前,请确保已经阅读并理解了如下两篇文章: 『线段树 Segment Tree』 『线段树简单运用』 引入 这是一种由\(THU-zkw\)大佬发明的数据结构,本质上是经典的线段树区间划分思想, ...
- Node中流的概念
在学习node的过程中,对于流的概念一直不是很理解,通过查阅一些资料,现在将自己对流的一些理解进行总结一下. 一.流的理解 首先我们必须知道什么是流,很多书中只是提到使用流读写文件怎么怎么方便,却不提 ...
- java游戏开发杂谈 - 线程
线程,让游戏拥有了动态变化的能力. java的图形界面,在启动的时候,就开始了一个线程. 这个线程负责处理:JFrame.JPanel等的绘制.事件处理. 它是由操作系统调用的,在程序启动时开启,程序 ...
- 初探奥尔良(Orleans)
由于工作上关系目前经常被各种并发数据问题搞得焦头烂额,要么要性能舍弃数据上得一致性,要么要一致性但是却得到了特别糟糕的响应.难道鱼和熊掌真的无法兼得吗? 然后找到了类似奥尔良这种基于Actor模型的k ...
- windows代码,路径分割
BOOL SplitPathName( PWSTR MyXbpathBuffer, wstring& wdrive, wstring& wdir, wstring& wfnam ...
- Service Fabric service 根据环境变量读取配置文件
前言 一个服务或者产品,往往需要三个环境:一个开发环境(Development),一个测试环境(Staging),一个生产环境(Production), 这就不可避免的需要多个配置文件来匹配相应的环境 ...
- Java 在PPT中绘制图形
Microsoft PowerPoint可支持在幻灯片中插入各种类型的图形并且可设置图形填充.线条颜色.图形大小.位置等.下面将通过Java编程来演示在PPT中绘制图形的方法. 工具:Free Spi ...
- Java虚拟机三:OutOfMemoryError异常分析
根据Java虚拟机规范,虚拟机内存中除过程序计数器之外的运行时数据区域都会发生OutOfMemoryError(OOM),本文将通过实际例子验证分析各个数据区域OOM的情况.为了更贴近生产,本次所有例 ...
- HTML基础系列
HTML标记语言,网页制作的第一步. 什么是HTML呢?查百度 基础语法 常用标签 HTML是超文本标记语言,HTML不用编译,直接在浏览器中执行,HTML是一个文本文件. HTML基本结构,标签,元 ...