Ext JS框架程序中阻止键盘触发回退或者刷新页面的代码分享


Posted in Javascript onJune 07, 2016

在 Extjs 开发中,我们需要屏蔽一些键盘按键,来避免用户在使用键盘操作的过程中不小心按到这些快捷键造成输入信息丢失等问题.

Ext.onReady(function(){    
      Ext.WindowMgr.zseed = 10000;  
      Ext.QuickTips.init();   
         
      Ext.getDoc().on("contextmenu", function(e){    
        e.stopEvent();    
      });   
        
      if(document.addEventListener){  
        document.addEventListener("keydown",maskBackspace, true);  
      }else{  
        document.attachEvent("onkeydown",maskBackspace);  
      }  
        
      function maskBackspace(event){  
        var event = event || window.event; //标准化事件对象  
        var obj = event.target || event.srcElement;  
        var keyCode = event.keyCode ? event.keyCode : event.which ?  
            event.which : event.charCode;  
        if(keyCode == 8){  
          if(obj!=null && obj.tagName!=null && (obj.tagName.toLowerCase() == "input"   
              || obj.tagName.toLowerCase() == "textarea")){  
            event.returnValue = true ;  
            if(Ext.getCmp(obj.id)){  
              if(Ext.getCmp(obj.id).readOnly) {  
                if(window.event)  
                  event.returnValue = false ; //or event.keyCode=0  
                else  
                  event.preventDefault();  //for ff  
              }  
            }  
          }else{  
            if(window.event)  
              event.returnValue = false ;  // or event.keyCode=0  
            else  
              event.preventDefault();  //for ff  
          }  
        }  
      }  
        
      var map = new Ext.KeyMap(document, [  
      {  
        key: [116], // F5  
        fn: function(){ },  
        stopEvent: true,  
        scope: this  
      },{  
        key: [37,39,115], //方向键左,右,F4  
        alt: true,  
        fn: function(){ },  
        stopEvent: true,  
        scope: this  
      }, {  
        key: [82], // ctrl + R  
        ctrl: true,  
        fn: function(){ },  
        stopEvent: true,  
        scope: this  
      }]);  
      map.enable();  
});

禁止在IE8中使用 F5 刷新还需加上代码 :

<body onkeydown="if(event.keyCode==116){event.keyCode=0;return false;}">
Javascript 相关文章推荐
jquery 关于event.target使用的几点说明介绍
Apr 26 Javascript
js中settimeout方法加参数的使用实例
Feb 27 Javascript
Bootstrap多级菜单的实现代码
May 23 Javascript
vue通过watch对input做字数限定的方法
Jul 13 Javascript
关于Ajax的原理以及代码封装详解
Sep 08 Javascript
node.js实现为PDF添加水印的示例代码
Dec 05 Javascript
js最实用string(字符串)类型的使用及截取与拼接详解
Apr 26 Javascript
对layui初始化列表的CheckBox属性详解
Sep 13 Javascript
JavaScript Window浏览器对象模型原理解析
May 30 Javascript
微信小程序实现翻牌抽奖动画
Sep 21 Javascript
原生JS生成指定位数的验证码
Oct 28 Javascript
vue 使用vant插件做tabs切换和无限加载功能的实现
Nov 04 Javascript
JavaScript基础语法之js表达式
Jun 07 #Javascript
JavaScript必看小技巧(必看)
Jun 07 #Javascript
通过正则表达式获取url中参数的简单实现
Jun 07 #Javascript
点击按钮出现60秒倒计时的简单js代码(推荐)
Jun 07 #Javascript
javascript显示倒计时控制按钮的简单实现
Jun 07 #Javascript
基于jQuery下拉选择框插件支持单选多选功能代码
Jun 07 #Javascript
jQuery原理系列-css选择器的简单实现
Jun 07 #Javascript
You might like
PHP实现活动人选抽奖功能
2017/04/19 PHP
详解thinkphp5+swoole实现异步邮件群发(SMTP方式)
2017/10/13 PHP
图片延迟加载的实现代码(模仿懒惰)
2013/03/29 Javascript
javascript控制Div层透明属性由浅变深由深变浅逐渐显示
2013/11/12 Javascript
学习JavaScript设计模式之状态模式
2016/01/08 Javascript
jQuery选择器及jquery案例详解(必看)
2016/05/20 Javascript
JQuery点击行tr实现checkBox选中的简单实例
2016/05/26 Javascript
基于Bootstrap的Metronic框架实现条码和二维码的生成及打印处理操作
2016/08/29 Javascript
原生JS和jQuery操作DOM对比总结
2017/01/19 Javascript
React中常见的动画实现的几种方式
2018/01/10 Javascript
配置eslint规范项目代码风格
2019/03/11 Javascript
js实现移动端tab切换时下划线滑动效果
2019/09/08 Javascript
利用JS如何获取form表单数据
2019/12/19 Javascript
Python 字典(Dictionary)操作详解
2014/03/11 Python
Python随机数random模块使用指南
2016/09/09 Python
python实现图片处理和特征提取详解
2017/11/13 Python
Python实现手写一个类似django的web框架示例
2018/07/20 Python
对Python强大的可变参数传递机制详解
2019/06/13 Python
python Pandas库基础分析之时间序列的处理详解
2019/07/13 Python
用python介绍4种常用的单链表翻转的方法小结
2020/02/24 Python
python的pip有什么用
2020/06/17 Python
Python用SSH连接到网络设备
2021/02/18 Python
新西兰优惠网站:Treat Me
2019/07/04 全球购物
Dr. Martens马汀博士法国官网:马丁靴鼻祖
2020/01/15 全球购物
音乐系毕业生自荐信
2013/10/27 职场文书
女大学生自我鉴定
2013/12/09 职场文书
员工年终演讲稿
2014/01/03 职场文书
绩效工资实施方案
2014/03/15 职场文书
经典英文广告词
2014/03/18 职场文书
企业节能减排实施方案
2014/03/19 职场文书
程序员求职信
2014/04/16 职场文书
贫困生助学金感谢信
2015/01/21 职场文书
入党自荐书范文
2015/03/05 职场文书
迎国庆主题班会
2015/08/17 职场文书
2019中小学生安全过暑期倡议书
2019/06/24 职场文书
2019个人工作计划书的格式及范文!
2019/07/04 职场文书