文档彩票走势图>>telerik中文文档>>概述
概述
AutoComplete 可通过屏幕阅读器访问,并提供 WAI-ARIA、Section 508、WCAG 2.1 和键盘支持。
注意:根据规范“作者必须确保具有角色组合框的元素包含或拥有具有角色文本框或搜索框的文本输入元素...”。请注意,在实现过程中,文本输入元素是具有 role="combobox" 的元素,并且不包含其他文本输入元素。此方法对于规范以及规范均有效。
如 中所述,“由于先前模式的实现问题,组合框指南在 ARIA 1.2 中发生了重大变化”。因此,我们将保留当前状态,即使它与 WAI-ARIA 1.1 规范相矛盾。
Kendo UI for jQuery AutoComplete提供广泛的辅助功能支持,使残障用户能够完全控制其功能。
自动完成符合标准]( ) 和要求,遵循针对其角色实现键盘导航的component最佳实践,提供了管理其焦点的选项,并针对最常见的屏幕阅读器进行了测试。
WAI-ARIA
下表列出了 AutoComplete 组件支持的选择器、属性和行为模式:
选择器 | 属性 | 用法 |
---|---|---|
.k-input-inner | role=combobox | 宣布存在自动完成作为用于过滤的自动完成的内部元素。 |
label for或aria-label或aria-labelledby | 该输入需要为其分配一个可访问的名称。 | |
aria-haspopup=listbox | 指示组件有一个列表框弹出窗口。 | |
aria-expanded=true/false | 宣布弹出窗口的可见性状态。 | |
aria-controls=.k-list-ul id | 指向列表框元素。表示该combobox元素控制listbox. | |
aria-activedescendant=.k-list-item.k-focus id | 指向弹出窗口中的焦点项目。通过键盘导航更改焦点项目。如果弹出窗口不可见,则该属性不应指向任何元素或应将其删除。 | |
aria-autocomplete=list | 启用过滤功能时,将呈现属性并将值设置为列表。 | |
aria-autocomplete=both | 当过滤和建议功能都启用时,将呈现属性并将值设置为两者。 | |
aria-autocomplete=inline | 属性已呈现,值设置为仅建议启用功能。 | |
readonly或者aria-readonly | 仅当自动完成功能为只读时才会呈现属性。 | |
aria-busy=true | 仅当自动完成加载数据时才会呈现属性。 | |
tabindex=0 | 该元素必须是可聚焦的。 | |
.k-invalid .k-input-inner,.ng-invalid .k-input-inner | aria-invalid=true | 仅当自动完成处于表单中并宣布组件的有效状态时才会呈现属性。 |
.k-disabled .k-input-inner | disabled=disabled或者aria-disabled=true | 仅当自动完成功能被禁用时才会呈现属性。 |
列表框弹出
组件的 Popup 元素应实现Popup List组件的规范。
选择器 | 属性 | 用法 |
---|---|---|
.k-animation-container | role=region | 当组件容器附加到<body>文档的元素时,需要为其分配一个里程碑角色。否则,应将其附加到具有适当标志性角色的元素。 |
aria-label或者aria-labelledby | 当容器分配了角色时提供标签region。 | |
.k-list-ul | role=listbox | 将 ul 元素标识为列表框。 |
aria-label或者aria-labelledby | 为组合框的列表框提供标签。 | |
.k-list-item | role=option | 将 li 元素标识为列表框选项。 |
.k-list-item.k-selected | aria-selected=true | 指示项目的选定状态。 |
第508条
AutoComplete 完全符合第 508 节的要求。
测试
AutoComplete 已经使用自动进行了广泛测试,并使用最常见的屏幕阅读器进行了手动测试。
屏幕阅读器
环境 | 工具 |
---|---|
火狐浏览器 | NVDA |
Chrome | JAWS |
微软Edge | JAWS |
自动化测试
AutoComplete 已使用进行了测试。