返回课程

键盘控制鼠标

重要性:4

将焦点放在鼠标上。然后使用箭头键移动它。

在新窗口中演示

P.S. 不要将事件处理程序放在除#mouse元素之外的任何地方。

P.P.S. 不要修改 HTML/CSS,这种方法应该是通用的,适用于任何元素。

打开一个沙箱用于此任务。

我们可以使用mouse.onclick来处理点击事件,并使用position:fixed使鼠标“可移动”,然后使用mouse.onkeydown来处理箭头键。

唯一的陷阱是keydown只会在具有焦点的元素上触发。因此,我们需要为该元素添加tabindex。由于我们被禁止更改HTML,我们可以使用mouse.tabIndex属性来实现这一点。

附注:我们也可以用mouse.onfocus替换mouse.onclick

在沙盒中打开解决方案。