Dasaria-autocomplete Attribut gibt an, ob die Eingabe von Text eine Anzeige von einer oder mehreren Vorhersagen für den beabsichtigten Wert des Benutzers für einecombobox,searchbox odertextbox auslösen könnte und wie Vorhersagen präsentiert werden, falls sie getroffen werden.

Beschreibung

Autovervollständigung ist ein Feature der Benutzeroberfläche, bei dem während der Eingabe eines Benutzers in ein Eingabefeld Vorschläge gemacht werden. Vorgeschlagene Texte zur Vervollständigung des Feldwerts erscheinen dynamisch im Feld nach dem Eingabecursor, und der vorgeschlagene Wert wird der Wert, wenn der Benutzer eine Aktion ausführt, wie z. B. Tabben, die den Fokus vom Feld entfernt.

Diearia-autocomplete Eigenschaft beschreibt das Art des Interaktionsmodells der Autovervollständigung, das eine Textbox, Suchbox oder Combobox verwenden wird, um Benutzern dynamisch bei der Vervollständigung von Texteingaben zu helfen. Es unterscheidet zwischen zwei Modellen: deminline Modell (aria-autocomplete="inline"), das einen einzelnen vorhergesagten Wert präsentiert, und demlist Modell (aria-autocomplete="list"), das eine Sammlung möglicher Werte in einem separaten Element darstellt, das neben oder unter dem Texteingabefeld auftaucht, ähnlich wie ein<datalist>. Ein dritter Wert,aria-autocomplete="both", ist für den Fall gedacht, dass die Benutzeroberfläche eine Liste präsentiert, während sie auch einen vorhergesagten Wert einschließt. Der Standardwert istnone, was bedeutet, dass die Textbox, Suchbox oder Combobox keinen Auto-Vervollständigungswert bereitstellen wird.

Diearia-autocomplete Eigenschaft beschreibt nur die Art des prädiktiven Verhaltens für ein Eingabeelement für unterstützende Technologien; sie bietet nicht die Funktionalität. Die eigentliche Autovervollständigung sollte mit HTML-Attributen oder JavaScript bereitgestellt werden.

Wenn der vorgeschlagene Autovervollständigungswert vorgeschlagene Werte bietet, die nicht von der Eingabe des Benutzers abhängig sind, ziehen Sie in Betracht, die Autovervollständigung für alle wegzulassen. Zum Beispiel könnte eine Suchbox-Eingabe, die ungefilterte kürzliche Suchbegriffe anzeigt, für ein Marketingteam auf einer E-Commerce-Site hilfreich sein, aber wahrscheinlich nicht für den Benutzer eines Screenreaders. Wenn es am besten ist, keinen Wert füraria-autocomplete anzugeben oder den Wert auf den Standardwertnone zu setzen, benötigen wahrscheinlich auch Ihre Nutzer ohne unterstützende Technologie diese Funktion nicht.

Wenn Sie Autovervollständigungsfunktionen implementieren, stellen Sie sicher, dass der vorgeschlagene Teil des Wertes als ausgewählter Text präsentiert wird, um zwischen der Benutzereingabe und dem Vorschlag unterscheiden zu können. Stellen Sie sicher, dass Benutzer, wenn der vorgeschlagene Wert nicht der gewünschte Wert ist, den Vorschlag einfach löschen oder durch Fortsetzung der Eingabe ersetzen können.

Beim Implementieren einer Liste von Werten sollte der DOM-Fokus auf dem Texteingabefeld bleiben, während die Vorschlagsliste angezeigt wird.

• Fügen Siearia-controls mit dem Wert der ID der vorgeschlagenen Werteliste hinzu.
• Fügen Siearia-haspopup hinzu, das der Rolle des Elements entspricht, das die Sammlung vorgeschlagener Werte enthält.
• Verwalten Sie den Fokus, falls erforderlich, einschließlich der Verwendung vonaria-activedescendant, falls das Sammlungselement dies unterstützt.
• Verwenden Sie den Zustandaria-expanded auf dem Element mit der Rollecombobox, um zu kommunizieren, dass die Liste angezeigt wird.

Wenn ein Autovervollständigungslistenwert automatisch akzeptiert wird, wenn das Feld den Fokus verliert, muss die Liste in einer Rolle enthalten sein, diearia-activedescendant unterstützt, wobei der Wert vonaria-activedescendant im Eingabefeld dynamisch angepasst wird, um auf das Element mit dem ausgewählten Vorschlag zu verweisen.

Werte

none (Standard)

Wenn ein Benutzer eine Eingabe macht, wird kein automatischer Vorschlag angezeigt.

inline

aria-autocomplete="inline" Text, der eine Möglichkeit zur Vervollständigung der bereitgestellten Eingabe vorschlägt, kann dynamisch nach dem Caret eingefügt werden.

list

aria-autocomplete="list" Wenn ein Benutzer eine Eingabe macht, kann ein Element mit einer Sammlung von Werten angezeigt werden, die die bereitgestellte Eingabe vervollständigen könnten.

both

aria-autocomplete="both" Eine Eingabe bietet beide Modelle gleichzeitig. Wenn ein Benutzer eine Eingabe macht, kann ein Element mit einer Sammlung von Werten angezeigt werden, die die bereitgestellte Eingabe vervollständigen könnten. Falls angezeigt, wird ein Wert in der Sammlung automatisch ausgewählt, und der Text zur Vervollständigung des automatisch ausgewählten Wertes erscheint nach dem Caret in der Eingabe.

Zugehörige Rollen

Verwendet in Rollen:

• combobox Rolle
• textbox Rolle
• Erbt vonsearchbox Rolle

Spezifikationen

Siehe auch

• combobox Rolle
• textbox Rolle
• searchbox Rolle
• <datalist> Element und das<input> list Attribut
• aria-controls Attribut
• aria-haspopup Attribut
• aria-activedescendant Attribut
• aria-expanded Attribut
• Editable Combobox With Both List and Inline Autocomplete Example
• Event.ariaAutoComplete