SuperAPI AI 工具集

dropdown-select

编程与开发

查看项目

更新于 10-15 21:12

技能介绍

用途:为下拉菜单、选择输入、组合框(combobox)和多选模式提供设计与实现规范,帮助根据选项数量选择合适控件并保证无障碍可用。

主要能力与选型建议:2-3 个选项用单选按钮或分段控件,全部可见;4-7 个用下拉选择;8-15 个用带搜索的下拉;15 个以上用可搜索的组合框;需要多选时用复选框列表或标签输入,以清晰呈现选择状态。

下拉设计:最多可见 6-8 项后滚动;触发器显示已选项;选中项加勾选或高亮;支持键盘导航(输入跳转、方向键移动、回车选择);长列表分组并加标签;单选选中后关闭,多选需显式“完成”。

组合框:随输入过滤结果,高亮匹配文本,适当允许自定义值,显示“无匹配”状态并给出建议,提供清除按钮重置选择。

多选:触发器显示已选数量(如“3 selected”),已选项以可单独移除的标签/芯片展示,长列表提供“全选”和“清空”,选择时不关闭。

无障碍:选项容器用 role="listbox",每项用 role="option",当前选择用 aria-selected,触发器用 aria-expanded,并支持完整键盘操作(Tab、方向键、Enter、Escape)。

限制:资料未提供具体代码示例、框架实现、安装命令或平台支持信息。