Javascript 如何在组中使用键控事件?
我正在研究一个由矩形和变形金刚组成的小组,现在需要用鼠标以外的方式移动它。使用容器,我可以使用箭头键移动它,但是对于group,Keydown功能不起作用,我已经尝试使用group.on,但没有成功Javascript 如何在组中使用键控事件?,javascript,konvajs,Javascript,Konvajs,我正在研究一个由矩形和变形金刚组成的小组,现在需要用鼠标以外的方式移动它。使用容器,我可以使用箭头键移动它,但是对于group,Keydown功能不起作用,我已经尝试使用group.on,但没有成功 我希望当单击箭头时,箭头将在移动它的组中开始工作。您不能使用Konva在画布节点(例如group或Shape)上收听键盘事件。但你可以很容易地模仿它 您可以使Stage节点可聚焦,并在其上收听键盘事件。然后在事件处理程序中执行所需的操作 var container = stage.contai
我希望当单击箭头时,箭头将在移动它的组中开始工作。您不能使用
Konva
在画布节点(例如group
或Shape
)上收听键盘事件。但你可以很容易地模仿它
您可以使Stage
节点可聚焦,并在其上收听键盘事件。然后在事件处理程序中执行所需的操作
var container = stage.container();
// make it focusable
container.tabIndex = 1;
// focus it
// also stage will be in focus on its click
container.focus();
const DELTA = 4;
container.addEventListener('keydown', function (e) {
if (e.keyCode === 37) {
circle.x(circle.x() - DELTA);
} else if (e.keyCode === 38) {
circle.y(circle.y() - DELTA);
} else if (e.keyCode === 39) {
circle.x(circle.x() + DELTA);
} else if (e.keyCode === 40) {
circle.y(circle.y() + DELTA);
} else {
return;
}
e.preventDefault();
layer.batchDraw();
});
演示:欢迎来到Stackoverflow!请使用所需的行为、特定问题和代码更新您的问题。见: