一键导入
autocomplete
Use when implementing suggest options as users type.
用 Codex 或 Claude 帮你安装 复制这段 Prompt,粘贴到 Codex、Claude 或其他助手里,让它检查 Skill 页面并帮你完成安装。
菜单
Use when implementing suggest options as users type.
用 Codex 或 Claude 帮你安装 复制这段 Prompt,粘贴到 Codex、Claude 或其他助手里,让它检查 Skill 页面并帮你完成安装。
基于 SOC 职业分类
Use when implementing help users understand their current location.
Use when implementing expand and collapse content sections.
Use when implementing user account configuration and preferences.
Use when implementing social activity and updates stream.
Use when implementing conversational AI chat interfaces.
Use when implementing handling AI-specific errors.
| name | autocomplete |
| description | Use when implementing suggest options as users type. |
| metadata | {"id":"autocomplete","category":"forms","pattern":"Autocomplete","source":"uxpatterns.dev","url":"https://uxpatterns.dev/patterns/forms/autocomplete","sourcePath":"apps/web/content/patterns/forms/autocomplete.mdx"} |
Suggest options as users type
Autocomplete helps users quickly find and select values from predefined options as they type. Autocomplete combines text input flexibility with dropdown-style selection, providing real-time suggestions matching user input. This pattern reduces errors, speeds data entry, and improves form completion.
references/pattern.md, then choose the smallest viable variation.role="combobox", aria-expanded, aria-controls).ArrowUp/ArrowDown, Enter, Escape, and Tab.aria-activedescendant and stable option IDs.For full implementation detail, examples, and testing notes, see references/pattern.md.
Pattern page: https://uxpatterns.dev/patterns/forms/autocomplete