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 相关文章推荐
JavaScript 组件之旅(二)编码实现和算法
Oct 28 Javascript
Javascript 面向对象(一)(共有方法,私有方法,特权方法)
May 23 Javascript
js和as的稳定传值问题解决
Jul 14 Javascript
jquery模拟SELECT下拉框取值效果
Oct 23 Javascript
jquery使用ajax实现微信自动回复插件
Apr 28 Javascript
JS获得图片alt信息的方法
Apr 01 Javascript
js实现图片无缝滚动
Dec 23 Javascript
JSON字符串和对象相互转换实例分析
Jun 16 Javascript
React操作真实DOM实现动态吸底部的示例
Oct 23 Javascript
学习Vue组件实例
Apr 28 Javascript
vue实现微信浏览器左上角返回按钮拦截功能
Jan 18 Javascript
JavaScript经典案例之简易计算器
Aug 24 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
Discuz! Passport 通行证整合
2008/03/27 PHP
php escape URL编码
2008/12/10 PHP
PHPEXCEL 使用小记
2013/01/06 PHP
PHP错误提示的关闭方法详解
2013/06/23 PHP
thinkphp3.x中display方法及show方法的用法实例
2016/05/19 PHP
yii2.0框架使用 beforeAction 防非法登陆的方法分析
2019/09/11 PHP
PHP切割整数工具类似微信红包金额分配的思路详解
2019/09/18 PHP
JavaScript入门教程(6) Window窗口对象
2009/01/31 Javascript
jQuery学习总结之jQuery事件
2014/06/30 Javascript
Javascript让DEDECMS告别手写Tag
2014/09/01 Javascript
JavaScript中的变量作用域介绍
2014/12/31 Javascript
JavaScript实现下拉列表框数据增加、删除、上下排序的方法
2015/08/11 Javascript
jquery+css3实现会动的小圆圈效果
2016/01/27 Javascript
AngularJS  双向数据绑定详解简单实例
2016/10/20 Javascript
JavaScript实现类似拉勾网的鼠标移入移出效果
2016/10/27 Javascript
JS实现图片垂直居中显示小结
2016/12/13 Javascript
详解angularJS自定义指令间的相互交互
2017/07/05 Javascript
Vue指令指令大全
2019/02/09 Javascript
vue中在vuex的actions中请求数据实例
2019/11/08 Javascript
[02:32]DOTA2英雄基础教程 美杜莎
2014/01/07 DOTA
Python中模块string.py详解
2017/03/12 Python
Python编程求解二叉树中和为某一值的路径代码示例
2018/01/04 Python
不到40行代码用Python实现一个简单的推荐系统
2019/05/10 Python
树莓派使用python-librtmp实现rtmp推流h264的方法
2019/07/22 Python
python 监控服务器是否有人远程登录(详细思路+代码)
2020/12/18 Python
CSS3 制作绽放的莲花采用效果叠加实现
2013/01/31 HTML / CSS
canvas版人体时钟的实现示例
2021/01/29 HTML / CSS
Java面试中常遇到的问题,也是需要注意的几点
2013/08/30 面试题
SOA面试题:如何在SOA中实现松耦合
2013/07/21 面试题
机械设计及其自动化专业推荐信
2013/10/31 职场文书
怎样客观的做好自我评价
2013/12/28 职场文书
省文明单位申报材料
2014/05/08 职场文书
质检员工作总结2015
2015/04/25 职场文书
运动会宣传语
2015/07/13 职场文书
宣传部部长竞选稿
2015/11/21 职场文书
来探秘“德国中小企业”的成功之道
2019/07/26 职场文书