aria-checked

Das aria-checked Attribut zeigt den aktuellen "ausgewählten" Zustand von Kontrollkästchen, Optionsfeldern und anderen Widgets an.

Hinweis: Verwenden Sie nach Möglichkeit ein HTML <input> Element mit type="checkbox" und type="radio", da diese eingebaute Semantik haben und keine ARIA-Attribute erfordern.

Beschreibung

Das aria-checked Attribut gibt an, ob das Element ausgewählt (true), nicht ausgewählt (false) oder ob der ausgewählte Status unbestimmt (mixed) ist, was bedeutet, dass es weder ausgewählt noch nicht ausgewählt ist. Der mixed Wert wird von den Tri-State-Eingaberollen checkbox und menuitemcheckbox unterstützt.

Der mixed Wert wird nicht auf radio, menuitemradio oder switch und Elemente, die von diesen erben, unterstützt. Der Wert wird false, wenn mixed gesetzt wird, wenn er nicht unterstützt wird.

html
<span
  role="checkbox"
  id="checkBoxInput"
  aria-checked="false"
  tabindex="0"
  aria-labelledby="chk15-label"></span>
<label id="chk15-label">Subscribe to the newsletter</label>

Das tabindex Attribut ist erforderlich, um den Fokus zu aktivieren. JavaScript ist erforderlich, um den aria-checked Zustand zu wechseln. Und falls dieses Kontrollkästchen Teil eines absendbaren Formulars ist, ist mehr JavaScript erforderlich, um einen Namen und einen Wert festzulegen.

Das Obige hätte so geschrieben werden können:

html
<input type="checkbox" id="chk15-label" name="Subscribe" />
<label for="chk15-label">Subscribe to the newsletter</label>

Durch die Verwendung des <input> Elements mit type="checkbox" anstelle von ARIA ist kein JavaScript erforderlich.

Werte

false

Das Element unterstützt das Auswählen, ist aber derzeit nicht ausgewählt.

true

Das Element ist ausgewählt.

mixed

Nur für checkbox und menuitemcheckbox, entspricht indeterminate, was einen gemischten Moduswert angibt, der weder ausgewählt noch nicht ausgewählt ist.

undefined (Standard)

Das Element unterstützt das Auswählen nicht.

Zugehörige Rollen

Zugehörige Schnittstellen

Element.ariaChecked

Die ariaChecked Eigenschaft, Teil der Element Schnittstelle, spiegelt den Wert des aria-checked Attributs wider.

ElementInternals.ariaChecked

Die ariaChecked Eigenschaft, Teil der ElementInternals Schnittstelle, spiegelt den Wert des aria-checked Attributs wider.

js
myHTMLElement.ariaChecked = true;

Spezifikationen

Specification
Accessible Rich Internet Applications (WAI-ARIA)
# aria-checked
Unknown specification

Siehe auch