WAI-ARIA: aria-pressed (State)
Description
Indicates the current “pressed” state of toggle buttons. See related aria-checked and aria-selected.
Toggle buttons require a full press-and-release cycle to change their value. Activating it once changes the value to true, and activating it another time changes the value back to false. A value of mixed means that the values of more than one item controlled by the button do not all share the same value. Examples of mixed-state buttons are described in WAI-ARIA Authoring Practices [wai-aria-practices-1.1]. If the attribute is not present, the button is not a toggle button.
The aria-pressed attribute is similar but not identical to the aria-checked attribute. Operating systems support pressed on buttons and checked on checkboxes.
Browser Compatibility
| desktop | mobile | |||||||||||
|---|---|---|---|---|---|---|---|---|---|---|---|---|
ariaPressed | ChromeFull support81 | EdgeFull support81 | FirefoxNo supportNo | Internet ExplorerNo supportNo | OperaFull support68 | SafariFull support12.1 | WebView AndroidFull support81 | Chrome AndroidFull support81 | Firefox for AndroidNo supportNo | Opera AndroidFull support58 | Safari on iOSFull support12.2 | Samsung InternetFull support13.0 |
Screen Reader Support
| Expectation | JAWS | Narrator | NVDA | Orca | TalkBack | VoiceOver (iOS) | VoiceOver (macOS) | ||||
|---|---|---|---|---|---|---|---|---|---|---|---|
| Chrome | Edge | Firefox | Edge | Chrome | Edge | Firefox | Firefox | Chrome | Safari | Safari | |
| MUST convey the “false” value | supported | supported | supported | supported | supported | supported | supported | supported | partial | supported | supported |
| MUST convey the “true” value | supported | supported | supported | supported | supported | supported | supported | supported | partial | supported | supported |
| MUST convey the “mixed” value | supported | supported | supported | none | none | none | none | none | none | none | supported |
| MUST convey the “undefined” value | supported | supported | supported | supported | supported | supported | supported | supported | supported | supported | supported |
| MUST convey changes in state | supported | supported | supported | none | partial | partial | partial | supported | supported | partial | partial |
aria-pressed Example
HTML Example
<button aria-pressed="false">Mute</button>HTML Example 2
<div role="toolbar" aria-label="sorting options" aria-controls="sortable">
<button type="button" aria-pressed="true" data-sort="ascending">A to Z</button> <button type="button" aria-pressed="false" data-sort="descending">Z to A</button>
</div>
<ul id="sortable" tabindex="-1">
<li>Fiddler crab</li>
<li>Hermit crab</li>
<li>Red crab</li>
<li>Robber crab</li>
<li>Sponge crab</li>
<li>Yeti crab</li>
</ul>Characteristics
Used in Roles
- button
Value
- tristate:
Value representing true or false, with an intermediate “mixed” value. The default value for this value type is False, unless otherwise specified. - false
- The element supports being pressed but is not currently pressed.
- mixed
- Indicates a mixed mode value for a tri-state toggle button.
- true
- The element is pressed.
- undefined (default)
- The element does not support being pressed.
Semantic HTML
No HTML element equivalent.
Reference
- WAI-ARIA 1.2 Specification
Refer to the notes from the WAI-ARIA 1.2 specification for more information on aria-pressed. - A11Y Support
The screenreader compatibility for each of the ARIA attributes is taken from the A11Y Support. Please refer to the original source if screenreader compatibility is updated for aria-pressed. - MDN Web Docs
The browser compatibility for each of the ARIA attributes is taken from the MDN Web Docs. Please refer to the original source if browser compatibility is updated for aria-pressed.
