屏幕阅读器能否识别带role="combobox"的input元素的展开/收起状态？

使用<input role="combobox">时，完全可以让屏幕阅读器识别并播报aria-expanded的状态，但需要搭配完整的ARIA关联结构，不能仅单独设置role="combobox"和aria-expanded属性。

• 核心配置要求：combobox控件（input）必须通过aria-controls属性关联到对应的下拉列表容器，同时下拉列表需要设置role="listbox"，并同步aria-hidden属性与展开状态：

  <input 
    type="text" 
    role="combobox" 
    aria-expanded="false" 
    aria-controls="dropdown-options"
    aria-autocomplete="list"
  >
  <ul id="dropdown-options" role="listbox" aria-hidden="true">
    <li role="option">选项A</li>
    <li role="option">选项B</li>
  </ul>
  

• 状态切换逻辑：展开下拉列表时，需同时将input的aria-expanded设为true，下拉列表的aria-hidden设为false；收起时则反向设置两个属性。
• 你之前只有设置role="listbox"时能读取状态，是因为单独的listbox作为可展开控件，屏幕阅读器对其状态的播报逻辑更直接；而combobox属于复合控件，必须依赖完整的关联关系才能触发状态播报。
• 额外提示：不同屏幕阅读器（如NVDA、VoiceOver、JAWS）对属性的解析可能存在细微差异，建议在主流辅助工具中测试验证。

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