javascript - 在可聚焦元素上编写箭头键导航的指南？

Question

我想让我页面上的链接和输入元素具有可通过箭头键导航的焦点。如果我只考虑向上/向下箭头键，这很容易，它们与 tab/shift+tab 的模式相同。

只需找到下一个元素并关注它。

谁能建议一种巧妙的方法来处理用户想要在最近的元素上左右移动的情况？

Answer 1

我认为最好的方法是定义一个自定义的 arrow_nav 排序索引，如下所示：

screen.addInput({ name:'height', arrow_nav_index:1 });
screen.addInput({ name:'weight', arrow_nav_index:2 });
screen.addInput({ name:'eye color', arrow_nav_index:3 });
screen.addInput({ name:'hair color', arrow_nav_index:4 });
screen.addInput({ name:'star sign', arrow_nav_index:5 });
screen.addInput({ name:'think star signs are bullshit?', arrow_nav_index:6 });

然后我们可以在 (1,2,3) 和 (4,5,6) 之间垂直箭头而不改变列。我们也可以在 (1,4), (2,5), (3,6) 之间水平箭头，而不改变行。

这是基本的想法。我认为这样做是作为自定义地图。或者简单地通过为输入列指定列高来自动化它，然后隐式地为每个输入提供添加顺序的索引，这将使箭头导航成为现实。

万岁。