Extjs4 按钮绑定键盘按键

//新建一个js文件,文件内容如下:
//在需要的地方引用此文件
Ext.ux.ToolbarKeyMap = Ext.extend(Object, (function() {
    var kb,
        owner,
        mappings;

    function addKeyBinding(c) {
        if (kb = c.keyBinding) {
            delete c.keyBinding;
            if (!kb.fn && c.handler) {
                kb.fn = function(k, e) {
                    e.preventDefault();
                    e.stopEvent();
                    c.handler.call(c.scope, c, e);
                }
            }
            mappings.push(kb);
            var t = [];
            if (kb.ctrl) t.push('Ctrl');
            if (kb.alt) t.push('Alt');
            if (kb.shift) t.push('Shift');
            t.push(kb.key.toUpperCase());
            c.hotKey = t.join('+');
            c.showHotKey = kb.showHotKey;
            if (c instanceof Ext.menu.Item) {
                c.onRender = Ext.Function.createSequence(c.onRender,addMenuItemHotKey);
            } else if ((c instanceof Ext.Button) && (c.showHotKey)) {
                c.onRender = Ext.Function.createSequence(c.onRender,addButtonHotKey);
            }
        }
        if ((c instanceof Ext.Button) && c.menu) {
            c.menu.cascade(addKeyBinding);
        }
    }

    function findKeyNavs() {
        delete this.onRender;
        if (owner = this.ownerCt) {
            mappings = [];
            this.cascade(addKeyBinding);
            if (!owner.menuKeyMap) {
                //owner.menuKeyMap = new Ext.KeyMap(owner.el, mappings);
                var target = document;
                if((mappings[0].global!=null)&&(mappings[0].global==false))
                {
                    target=owner.el;
                }
                owner.menuKeyMap = new Ext.KeyMap(target, mappings);
                owner.el.dom.tabIndex = 0;
            } else {
                owner.menuKeyMap.addBinding(mappings);
            }
        }
    }

    function addMenuItemHotKey() {
        delete this.onRender;
        if((this.showHotKey!=null)&&(this.showHotKey == false))
            return;

        this.el.child('.x-menu-item-link').setStyle({
            overflow: 'hidden',
            zoom: 1
        });

        this.el.child('.x-menu-item-link').child('.x-menu-item-text').setStyle({
            'float': 'left'
        });

        this.el.child('.x-menu-item-link').createChild({
            style: {
                padding: '0px 0px 0px 15px',
                float: 'right'
            },
            html: this.hotKey
        });
    }

    function addButtonHotKey() {
        delete this.onRender;
        if((this.showHotKey!=null)&&(this.showHotKey == false))
            return;
        var p = this.btnEl.up('');
        p.setStyle({
            overflow: 'hidden',
            zoom: 1
        });
        if(p.up('td')!=null)
            p.up('td').setStyle('text-align', 'left');
        this.btnEl.setStyle('.x-menu-item-text').setStyle({
            'float': 'left'
        });
        p = p.createChild({
            style: {
                padding: '0px 0px 0px 15px',
                float: 'right',
                position: 'relative',
                bottom: Ext.isWebKit ? '-1px' : '-2px'
            },
            html: this.hotKey
        });
    }

    return {
        init: function(toolbar) {
            toolbar.onRender = Ext.Function.createSequence(toolbar.onRender,findKeyNavs);
            toolbar.doLayout = Ext.Function.createSequence(toolbar.doLayout,findKeyNavs);

        }
    }
})());

使用说明:

      

tbar:{
       plugins: new Ext.ux.ToolbarKeyMap(),
       items:[{
                 text: 'demo',
                 keyBinding: {
                      key: 'a',
                      alt: true
                 },
                 handler: demoClick
       }]
}


  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值