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 实现键盘上下左右功能的小例子
Sep 15 Javascript
ExtJS如何设置与获取radio控件的选取状态
Jan 22 Javascript
IE6-IE9使用JSON、table.innerHTML所引发的问题
Dec 22 Javascript
使用Vue.js创建一个时间跟踪的单页应用
Nov 28 Javascript
bootstrap如何让dropdown menu按钮式下拉框长度一致
Apr 10 Javascript
实例详解JSON取值(key是中文或者数字)方式
Aug 24 Javascript
jQuery 开发之EasyUI 添加数据的实例
Sep 26 jQuery
vue组件详解之使用slot分发内容
Apr 09 Javascript
element el-input directive数字进行控制
Oct 11 Javascript
使用Vue实现调用接口加载页面初始数据
Oct 28 Javascript
原生js滑动轮播封装
Jul 31 Javascript
vue 子组件修改data或调用操作
Aug 07 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
优化使用mysql存储session的php代码
2008/01/10 PHP
php 删除一维数组中某一个值元素的操作方法
2018/02/01 PHP
javascript实现文字图片上下滚动的具体实例
2013/06/28 Javascript
extjs中form与grid交互数据(record)的方法
2013/08/29 Javascript
JS根据生日算年龄的方法
2015/05/05 Javascript
浅谈js里面的InttoStr和StrtoInt
2016/06/14 Javascript
JS调用某段SQL语句的方法
2016/10/20 Javascript
python爬取安居客二手房网站数据(实例讲解)
2017/10/19 Javascript
JavaScript实现数组全排列、去重及求最大值算法示例
2018/07/30 Javascript
详解js中let与var声明变量的区别
2020/04/05 Javascript
layui button 按钮弹出提示窗口,确定才进行的方法
2019/09/06 Javascript
详解JavaScript 中的批处理和缓存
2020/11/19 Javascript
Python实现的密码强度检测器示例
2017/08/23 Python
Python实现数据可视化看如何监控你的爬虫状态【推荐】
2018/08/10 Python
python实现按首字母分类查找功能
2019/10/31 Python
Python scrapy增量爬取实例及实现过程解析
2019/12/24 Python
对python中 math模块下 atan 和 atan2的区别详解
2020/01/17 Python
python 线性回归分析模型检验标准--拟合优度详解
2020/02/24 Python
Django 允许局域网中的机器访问你的主机操作
2020/05/13 Python
Python数据相关系数矩阵和热力图轻松实现教程
2020/06/16 Python
解决python3.x安装numpy成功但import出错的问题
2020/11/17 Python
python SOCKET编程基础入门
2021/02/27 Python
全球知名的珠宝首饰品牌:Kay Jewelers
2018/02/11 全球购物
意大利制造的男鞋和女鞋:SCAROSSO
2018/03/07 全球购物
LG西班牙网上商店:Tienda LG Online Es
2019/07/30 全球购物
linux比较文件内容的命令是什么
2013/03/04 面试题
大一学生假期实习的自我评价
2013/10/12 职场文书
2014年综治宣传月活动总结
2014/04/28 职场文书
党员自我对照检查材料
2014/08/19 职场文书
临床医学生职业规划书范文
2014/10/25 职场文书
2014年银行柜员工作总结
2014/11/12 职场文书
2014年学校财务工作总结
2014/12/06 职场文书
编写python程序的90条建议
2021/04/14 Python
为什么代码规范要求SQL语句不要过多的join
2021/06/23 MySQL
低版本Druid连接池+MySQL驱动8.0导致线程阻塞、性能受限
2021/07/01 MySQL
解决Jenkins集成SonarQube遇到的报错问题
2021/07/15 Java/Android