HTML select元素键盘导航异常现象咨询及相关规范文档查询

这个<select>键盘导航的异常行为，核心原因是浏览器在无匹配字符时的 fallback 逻辑，属于主流内核（WebKit/Blink）浏览器的统一实现：

• 当你按下可打印字符时，浏览器优先查找**以该字符开头（不区分大小写）**的选项，这是你熟悉的首字母/精准匹配逻辑；
• 如果没有找到任何匹配项，浏览器会切换到字符编码排序逻辑：
  1. 遍历选项列表，选中第一个首字符Unicode值大于输入字符的选项；
  2. 若所有选项的首字符Unicode值都小于输入字符，则直接选中列表最后一个选项。

对应你遇到的例子：

• 按下"B"（Unicode U+0042）：如果列表里没有以B开头的选项，第一个首字符大于B的就是"Cat"（首字符C的Unicode为U+0043），因此会选中它；
• 按下"Z"（Unicode U+005A）：如果列表里没有以Z开头的选项，且所有选项的首字符都小于Z，就会选中最后一个选项——也就是你看到的"Spider"。

另外补充几个可能导致行为感知不一致的细节：

• 增量搜索的连续输入：快速输入多个字符（比如"Ca"）会直接定位到匹配选项，而非分步跳转；
• 选项分组（<optgroup>）不影响键盘导航，浏览器会跨分组查找匹配项；
• 部分浏览器对包含特殊字符（如空格、重音符号）的选项，会忽略前导非字母字符后再进行匹配。

HTML标准定义了<select>的增量搜索交互逻辑，无匹配时的fallback行为虽未强制统一，但Chrome、Safari、Brave等浏览器都采用了上述字符编码排序的实现方式。

内容的提问来源于stack exchange，提问作者scg