aria-readonly

aria-readonly 属性は、要素が編集はできないが、それ以外の操作は可能であることを示します。

解説

対話可能な要素が、機能はするが編集できないことを示す場合に、aria-readonly="true" を設定します。これにより、通常はフォーカス可能でコピー可能な、対話可能な要素が読み取り専用(無効ではない)状態に設定されていることがユーザーに示されます。

aria-readonlytrue に設定されている場合、ユーザーはウィジェットの値を読み取ることはできますが、設定することはできません。読み取り専用要素はユーザーにとって依然として関連性があるため、ユーザーが要素またはそのフォーカス可能な子孫に移動したり、値をコピーしたりすることを妨げてはなりません。

例:

  • 変更してはならないフォーム要素。
  • スプレッドシートの行ヘッダーと列ヘッダー。
  • ショッピングカート内の合計金額。

変更不可能な値がフォーカスを受け取れないようにする場合は、代わりに aria-disabled を使用します。

メモ: セマンティック HTML フォームコントロールを使用する場合、readonly 属性を設定すると、aria-readonly="true" を含める必要はありません。

メモ: <input type="checkbox"> の値は編集できないため、readonly は関係ありません。ただし、role="checkbox" でチェックボックスを作成する場合は、aria-readonly 属性がサポートされます。

true

要素は読み取り専用です。

false (既定値)

要素は読み取り専用ではありません。

関連インターフェイス

Element.ariaReadOnly

Element インターフェイスの一部である ariaReadOnly プロパティは、aria-readonly 属性の値を反映します。

ElementInternals.ariaReadOnly

ElementInternals インターフェイスの一部である ariaReadOnly プロパティは、aria-readonly 属性の値を反映します。

関連付けられたロール

仕様書

Specification
Accessible Rich Internet Applications (WAI-ARIA)
# aria-readonly

関連情報