Ext.onReady(function(){ //6.13 Ext.KeyNav 为元素提供简单的按键处理方法 //可绑定的按键 enter,left,right,up,down,tab,esc,pageUp,pageDown,home,end,del //1.Ext.KeyNav.disable()废弃原来键盘绑定 //2.Ext.KeyNav.enbale()将废弃的从新生效 var myKey = new Ext.Panel({ title : 'keyNav键盘绑定对象示例', width : 320, renderTo : 'myKey', html : '<div style="padding:10px;"><div style="background-color:#3399ff" tabindex="1" id="div01">请点击我,而后按键盘enter键</div><div style="background-color:red" tabindex="2" id="div02">我是div02</div></div>' }); var myKeyEl = Ext.get("div01");//获取元素 var mnav = new Ext.util.KeyNav({ target : myKeyEl, left : function(e){ alert("你按下了左方向键"); }, right : function(e){ console.info("你按下了右方向键"); }, enter : function(e){ console.info("你按下了回车键"); }, scope : this//范围 }); mnav.enable(); //6.14 Ext.KeyMap 提供更灵活强大的对按键的处理方法 //Ext.KeyMap.disable();废弃已绑定的keyMap //Ext.KeyMap.enable();废弃的配置从新生效 //Ext.KeyMap.isEnabled() : Boolean 当前keymap配置是否有效 //on(Number/Array/Object key,Function fn,[Object scope]) //为调用对象快速地绑定key对象中指定的按键,触发后再scope上调用fn function myHandler(){ console.info("div02-enter"); } function myHandler1(){ console.info("arnt"); } /* var map1 = new Ext.KeyMap({ target : Ext.get("div02"), key : 13,//enter键 fn : myHandler, scope : this }); var map2 = new Ext.KeyMap({ target : Ext.get("div02"), key:"a\r\n\t", fn : myHandler1, scope : this }); */ var map = new Ext.util.KeyMap({ target: Ext.get("div02"), binding: [{ key: [10,13], fn: function(){ alert("回车键按下"); } }, { key: "abc", fn: function(){ alert('a, b 或者 c 按下'); } }, { key: "\t", ctrl:true, shift:true, fn: function(){ alert('Control + shift + tab 按下'); } }] }); //map1.enable(); //map2.enable(); //给对象添加键盘绑定 map.addBinding({ key : 'def', shift : true, fn : function(){ console.info("shift+d/e/f"); }, scope : this }); });