Element: ariaInvalid-Eigenschaft

Baseline 2023

Newly available

Since ⁨October 2023⁩, this feature works across the latest devices and browser versions. This feature might not work in older devices or browsers.

Die ariaInvalid-Eigenschaft der Element-Schnittstelle spiegelt den Wert des aria-invalid-Attributs wider. Relevant für die Rollen application, checkbox, combobox, gridcell, listbox, radiogroup, slider, spinbutton, textbox und tree, zeigt sie der Zugriffs-API an, ob der eingegebene Wert nicht dem vom Antrag erwarteten Format entspricht.

Wenn das Attribut nicht vorhanden ist oder auf den leeren String gesetzt ist, wird die assistierende Technologie den Wert so behandeln, als wäre er auf false gesetzt. Wenn das Attribut vorhanden ist, aber auf einen anderen Wert als false, grammar, spelling oder den leeren String ("") gesetzt ist, behandelt die assistierende Technologie den Wert als true. Die Eigenschaft spiegelt den Attributwert wider, wie er gesetzt wurde, nicht so, wie er von assistierender Technologie behandelt wird.

Wert

Ein String mit einem der folgenden Werte:

"true": Das Element ist ungültig.
"false" (Standard): Das Element befindet sich nicht in einem ungültigen Zustand.
"grammar": Das Element befindet sich in einem ungültigen Zustand, weil ein grammatikalischer Fehler entdeckt wurde.
"spelling": Das Element befindet sich in einem ungültigen Zustand, weil ein Rechtschreibfehler entdeckt wurde.

Beispiele

In diesem Beispiel wird das aria-invalid-Attribut auf dem Element mit der ID quote weggelassen, was null zurückgibt und als false behandelt wird. Mithilfe von ariaInvalid aktualisieren wir den Wert auf grammar (weil zwei Fehler vorhanden sind).

html

<div id="quote" role="textbox" contenteditable>you are your best thing..</div>

<hr />
<pre id="log"></pre>

const logElement = document.querySelector("#log");
function log(text) {
  logElement.innerText = `${logElement.innerText}${text}\n`;
  logElement.scrollTop = logElement.scrollHeight;
}

const el = document.getElementById("quote");
log(`Initial value: ${el.ariaInvalid}`);
el.ariaInvalid = "grammar";
log(`Updated value: ${el.ariaInvalid}`);

Spezifikationen

Specification
Accessible Rich Internet Applications (WAI-ARIA) # dom-ariamixin-ariainvalid

Browser-Kompatibilität

Siehe auch

Help improve MDN

Learn how to contribute Diese Seite wurde automatisch aus dem Englischen übersetzt.

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