aria-multiselectable="true" 仅声明多选能力，不自动实现交互逻辑，必须配合 role="listbox" 或 role="grid" 并用 javascript 完整实现键盘操作、状态更新与焦点管理。
aria-multiselectable 是声明能力，不是开启功能
aria-multiselectable="true" 只告诉辅助技术“这个容器支持多选”，它不绑定任何键盘逻辑、不响应 Ctrl/Cmd 点击、也不自动切换 aria-selected。你必须自己用 JavaScript 实现：监听点击（判断是否按住 Ctrl/Cmd 或 Shift）、更新每个子项的 aria-selected、同步视觉样式、管理焦点。漏掉任一环，屏幕阅读器用户就会听到“多选列表”，但实际操作时无法选中、无法取消、甚至读不出当前状态。
必须配合 role="listbox" 或 role="grid" 使用
单独加 aria-multiselectable 没有意义。它只在以下两种语义上下文中有效：
- 父容器设
role="listbox"，子项为role="option"（如自定义下拉菜单） - 父容器设
role="grid"，子项为role="row"+role="cell"或role="gridcell"（如可多选的数据表格）
常见错误是给 div 直接加 aria-multiselectable="true" 却没设 role，这会被屏幕阅读器忽略或误读为普通容器。另外，role="listbox" 容器必须可聚焦（如加 tabindex="0"），否则键盘用户根本进不去。
选中状态必须由 JS 动态维护，且要和视觉一致
每个可选项需显式设置 aria-selected="true" 或 "false"，不能靠 CSS 类名或 data 属性代替。重点注意：
- 初始渲染时，所有子项的
aria-selected必须明确为"false"，不能省略——省略等于未定义，辅助技术可能默认视为未选中，也可能报错 - 用户 Shift+点击范围选择时，JS 要遍历起始到终点的所有项并批量更新
aria-selected，不能只处理首尾 - 若某项被禁用（
aria-disabled="true"），它的aria-selected仍可为"true"，但 JS 不应允许再次点击切换 - 每次更新后，建议触发
aria-activedescendant指向当前焦点项，尤其在虚拟滚动列表中，否则屏幕阅读器可能读不到高亮项
别和原生
<select multiple></select> 自带完整语义和行为，不需要、也不应该再加 aria-multiselectable。浏览器已原生支持 Ctrl/Cmd 多选、Shift 区间选择、selectedOptions API、表单提交格式等。强行叠加 ARIA 属性反而可能干扰辅助技术解析，导致重复播报或逻辑冲突。只有当你用 div + role="listbox" 完全模拟 select 行为时，才需要 aria-multiselectable ——这时你其实是在重写一套可访问的多选控件，工作量远超加个属性。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
