原文:http://www.cnblogs.com/xdp-gacl/p/3785806.html

今天在IE浏览器下发现,当把使用readonly="readonly"属性将文本框设置成只读<input type="text" readonly="readonly"/>时有一个奇怪的问题:如果光标进入只读文本框,然后按下Backspace键,就会跳转到上一个页面,效果就像点击了浏览器的后退按钮返回前一个页面一样,而在火狐和google下没有这样的问题出现,为了解决这个问题,写了一个如下的处理方法,如果文本框是只读的,那么就禁用Backspace键。

代码如下:

  1. //处理键盘事件 禁止后退键(Backspace)密码或单行、多行文本框除外
  2. function banBackSpace(e){
  3. var ev = e || window.event;//获取event对象
  4. var obj = ev.target || ev.srcElement;//获取事件源
  5. var t = obj.type || obj.getAttribute('type');//获取事件源类型
  6. //获取作为判断条件的事件类型
  7. var vReadOnly = obj.getAttribute('readonly');
  8. //处理null值情况
  9. vReadOnly = (vReadOnly == "") ? false : vReadOnly;
  10. //当敲Backspace键时,事件源类型为密码或单行、多行文本的,
  11. //并且readonly属性为true或enabled属性为false的,则退格键失效
  12. var flag1=(ev.keyCode == 8 && (t=="password" || t=="text" || t=="textarea")
  13. && vReadOnly=="readonly")?true:false;
  14. //当敲Backspace键时,事件源类型非密码或单行、多行文本的,则退格键失效
  15. var flag2=(ev.keyCode == 8 && t != "password" && t != "text" && t != "textarea")
  16. ?true:false;
  17.  
  18. //判断
  19. if(flag2){
  20. return false;
  21. }
  22. if(flag1){
  23. return false;
  24. }
  25. }
  26.  
  27. window.onload=function(){
  28. //禁止后退键 作用于Firefox、Opera
  29. document.onkeypress=banBackSpace;
  30. //禁止后退键 作用于IE、Chrome
  31. document.onkeydown=banBackSpace;
  32. }

加上这样的处理之后,就可以解决"只读输入框在IE下按下Backspace键回退到前一个页面的问题了"

JavaScript屏蔽Backspace键的更多相关文章

  1. 【JS】【1】JavaScript屏蔽Backspace键(避免点击后页面产生回退)

    前言: 1,参考资料:JavaScript屏蔽Backspace键 - 孤傲苍狼 - 博客园(http://www.cnblogs.com/xdp-gacl/p/3785806.html) 2,参考的 ...

  2. JavaScript学习总结(二十二)——JavaScript屏蔽Backspace键

    今天在IE浏览器下发现,当把使用readonly="readonly"属性将文本框设置成只读<input type="text" readonly=&qu ...

  3. 页面屏蔽backspace键

    1 //页面加载完成 2 $(document).ready(function(){ 3 //禁止退格键 作用于Firefox.Opera 4 document.onkeypress = banBac ...

  4. Javascript屏蔽Backspace回退页面

    允许对输入框密码框等控件删除字符,但是不允许页面进行回退 <html lang="en" xmlns="http://www.w3.org/1999/xhtml&q ...

  5. JavaScript 屏蔽退格键

    document.onkeydown = function(){//屏蔽Backspace键 if (event.keyCode==8){ event.keyCode=0; event.returnV ...

  6. 【转】【JavaScript】禁用backspace键的后退功能,但是可以删除文本内容

    在JavaScript中添加以下代码,就可实现 禁用backspace键的后退功能,但是可以删除文本内容 // 禁用backspace键的后退功能,但是可以删除文本内容 document.onkeyd ...

  7. js禁止Backspace键使浏览器后退

    在项目中遇到按下Backspace键让浏览器后退的问题,上网搜了几种解决方案都不太理想.于是集众人之智,采众家之长,归纳如下: 这里主要参考博客http://q821424508.iteye.com/ ...

  8. 禁用backspace键的后退功能

    禁用backspace键的后退功能,但是可以删除文本内容<script language="JavaScript">document.onkeydown = check ...

  9. (转)ASP.NET禁用刷新重复提交Backspace键

    在网页制作中,由于Backspace键可以回退到上一个网页,利用了缓存的数据,从而导致一些错误发生.浏览器的后退按钮使得我们能够方便地返回以前访问过的页面,它无疑非常有用.但有时候我们不得不关闭这个功 ...

随机推荐

  1. YTU 3005: 皇后问题(栈和队列)

    3005: 皇后问题(栈和队列) 时间限制: 1 Sec  内存限制: 128 MB 提交: 6  解决: 3 题目描述 编写一个函数,求解皇后问题:在n*n的方格棋盘上,放置n个皇后,要求每个皇后不 ...

  2. sqlite3常用命令&语法

    sqlite数据库只用一个文件就ok,小巧方便,所以是一个非常不错的嵌入式数据库,SQLite大量的被用于手机,PDA,MP3播放器以及机顶盒设备.    Mozilla Firefox使用SQLit ...

  3. MVC模式:实现数据库中数据的增删改查功能

    *.数据库连接池c3p0,连接mysql数据库: *.Jquery使用,删除时跳出框,确定是否要删除: *.使用EL和JSTL,简化在jsp页面中插入的java语言 1.连接数据库 (1)导入连接数据 ...

  4. js获取url值

    // 获取地址栏的参数数组 function getUrlParams() { var search = window.location.search; // 写入数据字典 var tmparray ...

  5. ios项目中引用其他项目复习

    ios项目中引用其他开源项目,今天再次复习了,记个备注. 1. 将开源项目的.xcodeproj拖入项目frameworks 2. Build Phases下 Links Binary With Li ...

  6. bootstrap ace MVC

    <<html lang="en"><head> <meta charset="utf-8" /> <title& ...

  7. C#窗体截屏,简单例子

    private void button1_Click(object sender, EventArgs e) { Rectangle rect = System.Windows.Forms.Syste ...

  8. BZOJ 3199 escape

    题目链接:http://www.lydsy.com:808/JudgeOnline/problem.php?id=3199 题意:给出n个点.对于平面上任意一点p,p到n个点中的哪个点的距离最近我们就 ...

  9. js对字符串的操作

    js对字符串的操作 concat() – 将两个或多个字符的文本组合起来,返回一个新的字符串. indexOf() – 返回字符串中一个子串第一处出现的索引.如果没有匹配项,返回 -1 . charA ...

  10. 【转载】C++内存分配

    原文:C++内存分配 内存泄露相信对C++程序员来说都不陌生.解决内存泄露的方案多种多样,大部分方案以追踪检测为主,这种方法实现起来容易,使用方便,也比较安全. 首先我们要确定这个模块的主要功能: 能 ...