aria-placeholder

aria-placeholder 屬性定義了一個簡短的提示(一個單詞或短語),旨在幫助使用者在表單控制元件沒有值時進行資料輸入。提示可以是示例值或對預期格式的簡要描述。

描述

佔位符是在表單控制元件未設定值時顯示的文字。HTML placeholder 屬性允許為多個 HTML <input> 型別和 <textarea> 提供示例值或對預期格式的簡要描述。

如果您使用任何其他元素建立 textbox,則不支援 placeholder。這就是 aria-placeholder 發揮作用的地方。aria-placeholder 屬性可用於定義簡短的提示,以幫助使用者瞭解當非語義表單控制元件沒有值時預期哪種型別的資料。

html
<span id="date-of-birth">Birthday</span>
<div
  contenteditable
  role="textbox"
  aria-labelledby="date-of-birth"
  aria-placeholder="MM-DD-YYYY">
  MM-DD-YYYY
</div>

只要控制元件的值為空,包括刪除值時,都應向用戶顯示佔位符提示。

注意:ARIA 僅修改元素的可訪問性樹,以及輔助技術如何向用戶呈現內容。ARIA 不會更改元素的功能或行為。當不按預期用途和預設功能使用語義 HTML 元素時,必須使用 JavaScript 來管理行為。

aria-placeholder 與標籤一起使用,而不是代替標籤。它們具有不同的用途和不同的功能。標籤解釋了期望哪種資訊。佔位符文字提供了有關預期值的提示。

警告:使用佔位符代替可見標籤會損害許多使用者的可訪問性和可用性,包括老年使用者以及患有認知障礙、行動不便、精細運動技能障礙和視力障礙的使用者。標籤更好:它們始終可見,並且提供更大的點選區域來聚焦於控制元件。佔位符有幾個缺點:當控制元件具有任何值(包括空格)時,它們會消失,它們可能會讓使用者誤以為該值為預填充,並且預設顏色對比度不足。

注意:佔位符僅應用於顯示應輸入表單的資料型別的示例;它們不能替代正確的標籤。

<string>

在控制元件沒有值時顯示的單詞或短語。

關聯介面

Element.ariaPlaceholder

ariaPlaceholder 屬性(Element 介面的一部分)反映了 aria-placeholder 屬性的值。

ElementInternals.ariaPlaceholder

ariaPlaceholder 屬性(ElementInternals 介面的一部分)反映了 aria-placeholder 屬性的值。

關聯角色

用於角色

繼承到角色

規範

規範
可訪問的富網際網路應用程式 (WAI-ARIA)
# aria-placeholder

另請參閱