如何将访问密钥附加到 HTML 元素

Question

我尝试使用accesskey属性，但它要求用户使用键组合，但我想使用单个键来访问元素。 我试图在 web 上搜索它我找不到任何东西。

Answer 1

你可以在 Javascript 的帮助下做到这一点，但你真的不应该因为本机可用的访问键需要一个修饰符，这是有充分理由的。

请注意，这实际上不允许将分配给 accesskeys 的键用于访问这些元素以外的任何内容（例如，您不能再在输入中键入这些字母），这就是为什么这不是一个可接受的解决方案。

我只是展示它来展示一般的技术方法。

 document.addEventListener('keypress', function(event) { const target = document.querySelector(`[data-accesskey=${event.key.toLowerCase()}]`); if (target) { target.focus(); event.preventDefault(); } })

 <input type="text" data-accesskey="n" placeholder="Press n to focus this field" /> <button type="button" data-accesskey="p">Press p to focus this button</button>