ARIA: 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"，則不會向用戶公開。

當某個專案被選中而不是當前項時，例如在 tablist 中的 tab，請使用 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>

如果麵包屑中代表當前頁的元素不是連結，則 aria-current 是可選的。