accesskey仅对可聚焦元素生效，label需关联input等控件才能触发快捷键；应动态适配系统快捷键前缀，避免硬编码；禁用浏览器拦截键如ctrl+s，改用无冲突组合；tabindex是键盘导航基础，须与交互逻辑一致。
accesskey 属性只对可聚焦元素生效，label 本身不响应
直接给 <label accesskey="s"></label> 加快捷键不会触发任何跳转——因为 label 默认不可聚焦，浏览器忽略其 accesskey。真正起作用的是关联的 input、button 或 textarea 这类可聚焦控件。
正确写法有两种：
<label for="search">搜索</label><input type="text" id="search" accesskey="s">-
<label>搜索<input type="text" accesskey="s"></label>（嵌套方式，语义更紧凑）
用户按下对应组合键后，焦点会直接落到该 input 上，label 的点击、屏幕阅读器支持等功能完全保留。
不同系统快捷键前缀不同，不能硬写 “Ctrl+S”
Windows/Linux 是 Alt+S，macOS 是 Ctrl+Option+S，Linux 某些桌面环境还可能是 Alt+S 或 Meta+S。如果在 UI 上静态写 “按 Ctrl+S 搜索”，Mac 用户会困惑。
解决方案不是猜系统，而是用 CSS + JS 动态提示：
- 用
navigator.platform或navigator.userAgent判断是否为 macOS，渲染⌘S或Alt+S - 或统一用符号：CSS 中定义
.key-cmd::before { content: "⌘"; }、.key-alt::before { content: "⌥"; }，再根据平台切 class - 避免在文案中出现具体修饰键名称，改用图标或通用符号（如
<span class="key key-cmd">S</span>）
监听 keydown 实现功能型快捷键时，必须避开系统拦截
想用 Ctrl+S 触发表单保存？别试了。浏览器对 Ctrl+S、Ctrl+T、F5 等有强干预，event.preventDefault() 在多数情况下无效，仍会弹出保存对话框。
更可靠的做法是换组合键：
- 优先选
Ctrl+Enter、Ctrl+Shift+S、Alt+Shift+S这类无冲突组合 - 监听时用
event.key === 'Enter'+(e.ctrlKey || e.metaKey)，而非已废弃的keyCode - 务必加
e.preventDefault()，否则回车可能提交表单、空格可能滚动页面 - 排除输入区域：
if (e.target.matches('input, textarea, [contenteditable]')) return
tabindex 不是快捷键，但它是键盘导航的基础链路
tabindex 控制 Tab 键顺序，不是快捷键，但它决定了用户能否用键盘抵达你的控件。没有它，accesskey 跳转过去也没意义（尤其自定义组件）。
关键点：
- 原生表单控件（
input、button）默认tabindex=0，无需手动设 - 自定义按钮或卡片需加
tabindex="0"才能被 Tab 访问到 - 不要滥用
tabindex="1"之类正数——它会打断自然流，应仅在必要时用tabindex="-1"让元素可编程聚焦但不进 Tab 流 - 配合
focus()和blur()实现快捷键后的焦点管理，比如保存后自动回到第一个字段
真正容易被忽略的是：快捷键行为和键盘导航（Tab）必须一致。用户按 Alt+S 跳到搜索框，再按 Tab 应该进入下一个逻辑控件，而不是跳到页脚链接——这要求整个表单的 tabindex 流与交互意图对齐，而不是随便堆数字。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
