Javascript中的切换器实现

时间:2016-04-30 15:47:05

标签: javascript design-patterns ecmascript-6

我正在使用Javascript开发中型应用程序。我想创建一个类似于OS窗口切换器的切换器。当UI部件变为活动状态时,它应该将来自其他UI部件的所有事件侦听器静音,并为活动UI提供对键盘和鼠标输入的独占访问权限。例如,活动面板上的ctrl+c将复制面板数据,而活动画布上的ctrl+c将复制选定的形状。面板和画布都包含在一个视图中。

实现它的一种方法是利用观察者模式为一个观察者提供对其他观察者(切换器)静音的独占访问,这可以防止不需要的观察者干扰键盘和鼠标输入。

然而,这是一个实验性的解决方案,目前使用Javascript实现此功能的方法是什么?

1 个答案:

答案 0 :(得分:2)

对于调度键盘事件的元素,它必须具有焦点。但是,默认情况下,某些HTML元素(如divcanvas)无法专注于它们。但是,如果您设置tabIndex属性,它们也将是焦点。



function keypress() {
  console.log("works");
}

document.getElementById("element").focus();

<canvas width="10" height="10" tabIndex="0" onkeydown="keypress()" id="element"></canvas>
&#13;
&#13;
&#13;