aria-current

元素上的非空 aria-current 状态表示此元素代表容器或一组相关元素中的当前项。

描述

当您有一组相关元素时，例如面包屑中的几个链接或多步骤流程中的步骤，其中一个元素在组中与其他元素的样式不同，以指示有视力的用户这是其组中的当前元素，则应使用 aria-current 通知辅助技术用户通过样式指示的内容。

在面包屑列表中，当一组分页链接中的链接的样式指示用户当前位于该页面时，应在该链接上设置 aria-current="page"。在具有步骤指示器（例如多页调查或多步骤结账或注册流程）的多步骤流程中，当当前步骤图标在视觉上有所不同以表示它是当前步骤时，该图标的容器应具有 aria-current="step"，以便无法“看到”视觉差异的辅助技术用户可以使用。

aria-current 属性将设置为非 false 值的元素指示为容器或一组相关元素中的当前项。仅使用 aria-current 将一组元素中的一个元素标记为当前。

aria-current 属性接受有限的值列表，包括 page、step、location、date、time、true 和 false。此枚举值列表中未包含的任何非空字符串值都将被视为已设置 aria-current="true"，而不是默认的 false 值。如果属性不存在、为空字符串、存在但没有值或设置为 aria-current="false"，则不会将其公开给用户。

当选择某些内容而不是当前内容时，例如tab 在tablist 中，使用aria-selected 指示当前显示的 tabpanel。

注意：不要使用 aria-current 作为aria-selected 的替代品，在gridcell、option、row 或tab 中。

示例

“当前页面”的面包屑应在其上设置 aria-current="page"。

html

<nav aria-label="Breadcrumb" class="breadcrumb">
  <ol>
    <li>
      <a href="../../../../../">Web technology for developers</a>
    </li>
    <li>
      <a href="../../../../">Accessibility</a>
    </li>
    <li>
      <a href="../../../">ARIA</a>
    </li>
    <li>
      <a href="../../">ARIA States and Properties</a>
    </li>
    <li>
      <a href="./" aria-current="page">ARIA: `aria-current` attribute</a>
    </li>
  </ol>
</nav>