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中的函数
Jan 22 Javascript
Javascript中的Split使用方法与技巧
Mar 09 Javascript
浅析JavaScript中的事件机制
Jun 04 Javascript
js实现表单检测及表单提示的方法
Aug 14 Javascript
Node.js中使用socket创建私聊和公聊聊天室
Nov 19 Javascript
Node.js开发者必须了解的4个JS要点
Feb 21 Javascript
jsp 网站引入外部css或者js失效问题解决
Oct 31 Javascript
详解js树形控件—zTree使用总结
Dec 28 Javascript
webpack构建vue项目的详细教程(配置篇)
Jul 17 Javascript
babel之配置文件.babelrc入门详解
Feb 22 Javascript
vue+Element-ui实现分页效果实例代码详解
Dec 10 Javascript
如何在postman中添加cookie信息步骤解析
Jun 30 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实现斐波那契数列的简单写法
2014/07/19 PHP
原生JS实现Ajax通过GET方式与PHP进行交互操作示例
2018/05/12 PHP
js一组验证函数
2008/12/20 Javascript
基于jquery的使ListNav兼容中文首字拼音排序的实现代码
2011/07/10 Javascript
JS上传前预览图片实例
2013/03/25 Javascript
基于jQuery实现鼠标点击导航菜单水波动画效果附源码下载
2016/01/06 Javascript
Bootstrap编写一个在当前网页弹出可关闭的对话框 非弹窗
2016/06/30 Javascript
详解webpack解惑:require的五种用法
2017/06/09 Javascript
webpack4 入门最简单的例子介绍
2018/09/05 Javascript
Jquery和CSS实现选择框重置按钮功能
2018/11/08 jQuery
使用axios发送post请求,将JSON数据改为form类型的示例
2019/10/31 Javascript
Vue 解决多级动态面包屑导航的问题
2019/11/04 Javascript
vue子组件改变父组件传递的prop值通过sync实现数据双向绑定(DEMO)
2020/02/01 Javascript
如何在JavaScript中创建具有多个空格的字符串?
2020/02/23 Javascript
[04:38]完美世界携手游戏风云打造 卡尔工作室饰品系统篇
2013/04/25 DOTA
Python中os.path用法分析
2015/01/15 Python
Python统计单词出现的次数
2018/04/04 Python
通过Python模块filecmp 对文件比较的实现方法
2018/06/29 Python
详解将Pandas中的DataFrame类型转换成Numpy中array类型的三种方法
2019/07/06 Python
使用Python打造一款间谍程序的流程分析
2020/02/21 Python
python爬虫开发之使用Python爬虫库requests多线程抓取猫眼电影TOP100实例
2020/03/10 Python
30行Python代码实现高分辨率图像导航的方法
2020/05/22 Python
keras和tensorflow使用fit_generator 批次训练操作
2020/07/03 Python
python boto和boto3操作bucket的示例
2020/10/30 Python
html5/css3响应式页面开发总结
2018/10/16 HTML / CSS
HTML5拖放API实现拖放排序的实例代码
2017/05/11 HTML / CSS
澳大利亚最超值的自行车之家:Reid Cycles
2019/03/24 全球购物
四年级学生评语大全
2014/04/21 职场文书
高二学生评语大全
2014/04/25 职场文书
2014各大专业毕业生自我评价
2014/09/17 职场文书
校运动会广播稿300字
2014/10/07 职场文书
2015元旦主持词开场白和结束语
2014/12/14 职场文书
创先争优个人总结
2015/03/04 职场文书
JS如何实现基于websocket的多端桥接平台
2021/05/14 Javascript
TensorFlow中tf.batch_matmul()的用法
2021/06/02 Python
mybatis 获取无数据的字段不显示的问题
2021/07/15 Java/Android