fabricjs - fabric.js Canvas 监听键盘事件?

标签 fabricjs keyboard-events

在我的结构应用程序中,我目前正在监听某些按键,例如删除键,并删除任何选定的元素。我监听按键的方法是:

document.onkeydown = function(e) {
  if (46 === e.keyCode) {
  // 46 is Delete key
  // do stuff to delete selected elements
}

不过,我遇到了一个问题:页面上还有其他元素,例如文本框,并且在文本框中键入时,我不希望使用删除键删除任何元素。

this question ,描述了一种将事件监听器附加到 HTML5 Canvas 的方法:
canvas.tabIndex = 1000;

允许您使用 canvas.addEventListener与键盘事件。

我可以在织物的 Canvas 上使用类似的东西吗?

当我像这样尝试时,
var CANVAS = new fabric.Canvas('elemID', {selection: false})
CANVAS.tabIndex = 1000;
CANVAS.addEventListener("keydown", myfunc, false);

我从 Chrome 收到“Uncaught TypeError: undefined is not a function”。

最佳答案

这是我最终要做的事情:我在fabric 使用的 Canvas 周围有一个包装器 div,并且我已将事件监听器添加到此包装器中。

var canvasWrapper = document.getElementById('canvasWrap');
canvasWrapper.tabIndex = 1000;
canvasWrapper.addEventListener("keydown", myfunc, false);

这与我想要的完全一样。发生在文本框中的删除按钮不会被监听器接收到。

关于fabricjs - fabric.js Canvas 监听键盘事件?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/24684323/

相关文章:

javascript - Fabric.js 根据左上角位置循环对象

javascript - Chrome 中启用的硬件加速可防止 Canvas 使用 Fabricjs 显示矢量图像

Python实时键盘输入

linux - 如何在inittab中定义按下滚动锁的 Action ?

haskell - 使用 Haskell 处理联合按键

javascript - 如何使用箭头键 move 图像javascript

javascript - 在 Canvas 上放置更多图片

jquery - 使用 [Ctrl] 键选择多个织物对象

javascript - 在 Canvas 边界限制内移动对象

jquery - 在自定义 div 下拉菜单中发生键盘导航时移动垂直滚动条