Ext键盘处理

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
    });
    
    
});