javascript 模拟退格键_javascript禁止Backspace退格键的多种方法
方法1,采用键盘监听,处理键盘事件,处理方法是将type="text" "password"及"textarea"的输入框以外的元素做了退格键的禁用。
//处理键盘事件
function doKey(e){
var ev = e || window.event;//获取event对象
var obj = ev.target || ev.srcElement;//获取事件源
var t = obj.type || obj.getAttribute('type');//获取事件源类型
if(ev.keyCode == 8 && t != "password" && t != "text" && t != "textarea"){
return false;
}
}
//禁止后退键 作用于Firefox、Opera
document.οnkeypress=doKey;
//禁止后退键 作用于IE、Chrome
document.οnkeydοwn=doKey;
以上的代码,当编辑窗口中有一个不可编辑的输入框时,如果光标的位置在其上,敲退格键时依然会发生页面后退。
以下是针对第一种方法的改良版本。
//处理键盘事件 禁止后退键(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.οnkeypress=banBackSpace;
//禁止后退键 作用于IE、Chrome
document.οnkeydοwn=banBackSpace;
以上代码也有一个问题,在浏览器中,光标在一个不可编辑的输入框上时,退格键依然会产生页面后退效果!
原因分析: 在Firefox及Chrome中 obj.getAttribute('readonly') 返回的值是null,或"",而在IE中,该方法返回的是"readonly"或"",而且根据测试,并没有"enable"的属性,而应该是"disabled",因此,上述方法固然会失效.而且获取DOM的对象属性及标准属性的时候,不应该采用getAttribute方法,这是不准确的,应采用obj.attribute标准方法,这样不会存在因浏览器对js的解释差异而导致的兼容性问题。
修正以上bug的最终版本如下:
//处理键盘事件 禁止后退键(Backspace)密码或单行、多行文本框除外
//site www.jbxue.com
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.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 == 8 && (t=="password" || t=="text" || t=="textarea")&& (vReadOnly==true || vDisabled==true);
//当敲Backspace键时,事件源类型非密码或单行、多行文本的,则退格键失效
var flag2= ev.keyCode == 8 && t != "password" && t != "text" && t != "textarea" ;
//判断
if(flag2 || flag1)return false;
}
//禁止退格键 作用于Firefox、Opera
document.οnkeypress=banBackSpace;
//禁止退格键 作用于IE、Chrome
document.οnkeydοwn=banBackSpace;
javascript 模拟退格键_javascript禁止Backspace退格键的多种方法相关推荐
- jq设置保留两位小数_javascript实现保留两位小数的多种方法
第一种方法:javascript实现保留两位小数一位自动补零代码实例:第一种方法介绍一下如何实现对数字保留两位小数效果,如果数字的原本小数位数不到两位,那么缺少的就自动补零,这个也是为了统一的效果,先 ...
- JavaScript 的浅拷贝与深拷贝,栈与堆,深拷贝的多种方法,最全讲解
栈与堆 在 JavaScript 中也会将基本类型与对象类型称为值类型与引用类型.这个是因为基本类型中存储的是数据完整的值,而在引用类型中存储的仅是指向数据的一个地址. 在大部分编程语言中,变量会被存 ...
- JavaScript(JS) 清空删除数组元素的多种方法及示例代码
简介: 本文主要介绍JavaScript(JS)中,清空删除数组中的所有元素的多种方法,以及相关的示例代码. 1.使用[]得到一个新数组进行清空 例如, var arr1 = ['a','b','c' ...
- 屏蔽Backspace(退格)键后退功能
屏蔽"Backspace"(退格)键后退功能2008-01-17 16:18本来这个脚本不难,但是我接到的需求可不太容易实现 创建工单时,屏蔽"Backspace&quo ...
- html页面退格代码,HTML中的退格键
有没有一种方法可以实现HTML中的Backspace功能? 我们有什么特殊标签吗? 可以在StackOverflow本身中找到一个显示需要这种东西的示例. 请参阅获取Java中的当前堆栈跟踪. 在最佳 ...
- 使用XMANAGER 联接LINUX 后使用SQLPLUS 不能使用BACKSPACE 回格键.
使用XMANAGER 联接LINUX 后使用SQLPLUS 不能使用BACKSPACE 回格键.总是出来:^H 而使用TELNET 没有这情况发生.郁闷了好长一段时间,总是以为是XMANAGER 的原 ...
- 【JavaScript】JavaScript模拟实现面向对象一张图帮助你深刻理解原型链和原型对象
文章目录 一.JavaScript模拟面向对象 1.函数是类 2.函数中各种变量的声明 3.关于函数内的this 小结:JavaScript中函数是什么? 4.练习:面向对象思想编写Complex类 ...
- java过滤map去除重复数据,javascript模拟map输出与去除重复项的方法
本文实例讲述了javascript模拟map输出与去除重复项的方法.分享给大家供大家参考.具体方法如下: 1.Javascriptmap输出 function Map(){ // private va ...
- 点击返回键,将应用退至后台运行
问题 我看到网上很多方案都是这样: @Override public boolean onKeyDown(int keyCode, KeyEvent event) { if (keyCode == K ...
最新文章
- MindMotion MM32 单片机上的MicroPython移植-PWM
- transition标签_图解直到今天也没什么人知道的原生dialog标签(非常详细)
- Head First设计模式之策略模式(Strategy)
- matplotlib画图时间长_Python学习第86课-数据可视化之matplotlib介绍
- oracle查看密码设置,如何查看oracle账号权限设置密码Oracle事务的开始与结束
- python vtk_VTK在python环境下的安装和调用
- 《Reids 设计与实现》第十四章 集群(上)
- 闪迪内存卡软件测试,闪迪存储卡怎么样
- 武汉申报|2022年洪山区科技企业梯次培育专项资金申报指南
- win7查找计算机图片,win7电脑图片查看器丢失了的修复教程
- SpringSecurity前后端分离
- Web开发分享qq、微信组件-百度分享
- Hashtable的深拷贝
- BRITS: Bidirectional Recurrent Imputation for Time Series(时间序列的双向递归填补)论文详解
- 7-21 统计大写辅音字母 (15 分)
- JavaScript中Date的toGMTString()方法
- 2021北京大学暑期课程:区块链与隐私计算
- Amazon S3文件存储的上传下载如何测试
- 移动端跨平台开发Flutter 与 React Native对比
- 青少儿科学小实验--不倒翁易拉罐(重心实验)
热门文章
- 亿级流量电商JVM调优(转图灵学院)
- 阿里云 windows 服务器卸载阿里云盾
- 重要的产品分析模型:AARRR模型
- 斯皮尔曼相关系数范围_Spearman Rank(斯皮尔曼等级)相关系数及MATLAB实现
- 你真的了解composer吗
- python again_It’s really(wonder)________ to see you here again in Beijing.
- 大数据时代 无处安放的隐私数据
- 2500个常用汉字(用来练普通话的)
- 通联数据举办公益讲座 探讨金融大数据发展机会
- 两对等位基因控制一对相对性状的规律(基因互作)