Ext4 健盘导航

最新推荐文章于 2022-07-06 11:39:48 发布

原创最新推荐文章于 2022-07-06 11:39:48 发布 · 780 阅读

0 ·

CC 4.0 BY-SA版权

ExtJs 4 专栏收录该内容

12 篇文章

订阅专栏

本文详细介绍了如何利用Ext.KeyMap创建键盘事件与用户动作之间的映射，并通过Ext.KeyNav实现方向键控制元素位置。具体展示了如何设置自定义事件响应、组合键操作及鼠标控制层移动功能。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

1.Ext.KeyMap
通过Ext.KeyMap可以建立键盘和用户动作（Actions）之间的映射。

var f =function () {
    alert("B被按下");
}

var map =new Ext.KeyMap(Ext.getDoc(), [
  {
      key: Ext.EventObject.B,
      fn: f
  }, {
      key:"bc",
      fn:function () { alert('b,c其中一个被按下'); }
  },{
      key:"x",
      ctrl:true,
      shift:true,
      alt:true,
      fn:function () { alert('Control + shift +alt+ x组合键被按下.'); },
      stopEvent:true//屏蔽默认事件，如control+a为全选
  }, {
      key:"a",
      ctrl:true,
      fn:function () { alert('Control+A全选事件被阻止，自定义事件执行！'); },
      stopEvent:true
  }
]);

2.Ext.KeyNav
Ext.KeyNav主要是用来绑定方向键的，已支持的键：enter, left, right, up, down, tab, esc, pageUp, pageDown, del, home, end,现在通过它来实现鼠标控制层移动的功能：

var div1 = Ext.get("div1");
var nav =new Ext.KeyNav(Ext.getDoc(), {
  "left":function (e) {
      div1.setXY([div1.getX() - 1, div1.getY()]);
  },
  "right":function (e) {
      div1.setXY([div1.getX() + 1, div1.getY()]);
  },
  "up":function (e) {
      div1.move("up",1);
  },
  "down":function (e) {
      div1.moveTo(div1.getX(), div1.getY() + 1);
  },
  "enter":function (e) {

  }
});