我想知道如何在HTML按钮上添加快捷键功能。例如，如果你想为网页添加书签，你有chrome和safari的快捷键CTRL+ D，但我希望在按钮上添加相同的功能，这样当用户点击它时，它会为页面添加书签，而不是像code那样显示使用CTRL + D的警告消息。我不知道这是否可能，即使是流行的Addthis按钮显示相同的警告，使用ctrl+d像在这个site .
CTRL+ D
CTRL + D
zu0ti5jz1#
在HTML中，the accesskey attribute允许定义单个字母，并将修改键的处理留给浏览器和操作系统，以避免冲突。
accesskey
<button aria-label="+ add this" accesskey="a"><span aria-hidden="true">+</span></button>
这在理论上是很棒的，但在实践中存在一些可访问性问题。ARIA标准也有很长的一节是关于键盘快捷键的考虑。我仍然会选择这个，因为这是我们目前最好的选择，你不会想在代码中处理平台约定。您甚至可以使用accessKeyLabel attribute检索浏览器最终分配的组合键，但浏览器支持不是很好。
accessKeyLabel
button.title += ` [${button.accessKeyLabel || button.accessKey}]`;
如果您使用的是单字符快捷键，则需要提供一种机制来更改这些快捷键，以防它们与其他AT快捷键发生冲突：Understanding Success Criterion 2.1.4: Character Key Shortcuts
1条答案
按热度按时间zu0ti5jz1#
在HTML中，the
accesskeyattribute允许定义单个字母，并将修改键的处理留给浏览器和操作系统，以避免冲突。这在理论上是很棒的，但在实践中存在一些可访问性问题。ARIA标准也有很长的一节是关于键盘快捷键的考虑。
我仍然会选择这个，因为这是我们目前最好的选择，你不会想在代码中处理平台约定。
您甚至可以使用
accessKeyLabelattribute检索浏览器最终分配的组合键，但浏览器支持不是很好。如果您使用的是单字符快捷键，则需要提供一种机制来更改这些快捷键，以防它们与其他AT快捷键发生冲突：
Understanding Success Criterion 2.1.4: Character Key Shortcuts