aria-pressed

button ロールを持つ要素に aria-pressed を追加すると、ボタンがトグルボタンになります。aria-pressed 属性はトグルボタンにのみ関連します。これは、ボタンの現在の「押されている」状態を表します。

値は「三状態」です。つまり、値は true、false、mixed、または undefined の値に設定できます。aria-pressed の場合、ほとんどの三状態値タイプと同様に、既定値は undefined です。

トグルボタンの値を変更するには、ボタンを完全に押して離すサイクルが必要です。ボタンを 1 回押して離すと、値が true に変更されます。もう一度押して離すと、値は false に戻ります。

mixed の値は、ボタンによって制御される複数の項目の値がすべて同じ値を共有しないことを意味します。

状態が変わっても、トグルのラベルの内容を変更しないでください。ボタンのラベルに「一時停止」と表示されている場合は、押されたときに「再生」に変更しないでください。この例では、押された状態が true の場合、ラベルは「一時停止」のままなので、スクリーンリーダーは「Pause toggle button pressed」のように読み上げます。

<button aria-pressed="false">Pause</button>

ラベルを「一時停止」と「再生」の間で切り替えたい場合は、aria-pressed を使用しないでください。

ARIA の使用に関する第一のルールは、「要素を再利用して ARIA のロールや状態、プロパティを追加してアクセシブルにする代わりに、必要なセマンティクスと動作がすでに組み込まれているネイティブ機能を使用できる場合は、そうする」というものです。<button> でネイティブ HTML セマンティクスを採用すると、押された状態を切り替える代わりにラベルを切り替えることができるため、aria-pressed 属性は不要になります。

false

ボタンは押されることをサポートしていますが、現在は押されていません。

mixed

3 状態トグルボタンの混合モード値を示します。

true

ボタンが押されています。

undefined (既定値)

要素は押されることをサポートしていません。

Element.ariaPressed

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

ElementInternals.ariaPressed

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

使用するロール:

• button

• <input type="button">
• <input type="submit">
• <button>
• aria-checked
• aria-selected