ARIA: Attribut aria-checked

Das Attribut aria-checked gibt den aktuellen Auswahlzustand von Checkboxen, Radio-Buttons und anderen Widgets an.

Hinweis: Verwenden Sie nach Möglichkeit ein HTML-Element <input> mit type="checkbox" oder type="radio". Diese Elemente verfügen über eine integrierte Semantik und benötigen keine ARIA-Attribute.

Beschreibung

Das Attribut aria-checked gibt an, ob das Element ausgewählt (true), nicht ausgewählt (false) oder sein Auswahlzustand unbestimmt (mixed) ist. mixed bedeutet, dass es weder ausgewählt noch nicht ausgewählt ist. Der Wert mixed wird von den Rollen checkbox und menuitemcheckbox unterstützt, die drei Zustände zulassen.

Der Wert mixed wird von radio, menuitemradio, switch und Elementen, die von diesen Rollen erben, nicht unterstützt. Wird mixed verwendet, obwohl es nicht unterstützt wird, ist der Wert false.

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 Attribut tabindex ist erforderlich, damit das Element den Fokus erhalten kann. Zum Umschalten des Zustands von aria-checked ist JavaScript erforderlich. Wenn diese Checkbox Teil eines Formulars ist, das abgesendet werden kann, ist außerdem weiteres JavaScript nötig, um einen Namen und einen Wert festzulegen.

Das obige Beispiel hätte auch so geschrieben werden können:

html

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

Wenn Sie statt ARIA das Element <input> mit type="checkbox" verwenden, ist kein JavaScript erforderlich.

Werte

false: Das Element unterstützt einen Auswahlzustand, ist aber derzeit nicht ausgewählt.
true: Das Element ist ausgewählt.
mixed: Nur für checkbox und menuitemcheckbox. Entspricht indeterminate und bezeichnet einen gemischten Zustand, der weder ausgewählt noch nicht ausgewählt ist.
undefined (Standardwert): Das Element unterstützt keinen Auswahlzustand.

Zugehörige Rollen

Wird in folgenden Rollen verwendet:

Zugehörige Schnittstellen

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

myHTMLElement.ariaChecked = true;

Spezifikationen

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

Siehe auch

<input type="checkbox">
<input type="radio">
aria-pressed
aria-selected
Beispiel für eine Checkbox mit zwei Zuständen – w3.org
Beispiel für eine Checkbox mit gemischtem Zustand – w3.org

Help improve MDN

Erfahren Sie, wie Sie beitragen können Diese Seite wurde automatisch aus dem Englischen übersetzt.

Übersetzung auf GitHub anzeigen • Fehler mit dieser Übersetzung melden