HTMLElement: autocapitalize-Eigenschaft

Limited availability

This feature is not Baseline because it does not work in some of the most widely-used browsers.

Die autocapitalize-Eigenschaft des HTMLElement-Interfaces repräsentiert das Kapitalisierungsverhalten eines Elements für Benutzereingaben. Sie ist bei allen HTML-Elementen verfügbar, obwohl sie nicht auf alle wirkt, einschließlich:

<input> und <textarea>-Elemente.
Jedes Element mit gesetzt auf contenteditable.

autocapitalize beeinflusst nicht das Verhalten beim Tippen auf einer physischen Tastatur. Es beeinflusst das Verhalten anderer Eingabemechanismen wie virtuelle Tastaturen auf mobilen Geräten und Spracheingaben. Dies kann Benutzern helfen, die Dateneingabe schneller und einfacher zu gestalten, zum Beispiel durch automatisches Großschreiben des ersten Buchstabens jedes Satzes.

Es spiegelt den Wert des globalen HTML-Attributs autocapitalize wider.

Wert

Ein String, der das Kapitalisierungsverhalten des Elements für Benutzereingaben darstellt. Gültige Werte sind wie folgt:

none oder off: Keine Autokapitalisierung sollte angewandt werden, das heißt, alle Buchstaben sollten standardmäßig klein geschrieben werden.
sentences oder on: Der erste Buchstabe jedes Satzes sollte standardmäßig ein Großbuchstabe sein; alle anderen Buchstaben sollten standardmäßig klein geschrieben werden.
words: Der erste Buchstabe jedes Wortes sollte standardmäßig ein Großbuchstabe sein; alle anderen Buchstaben sollten standardmäßig klein geschrieben werden.
characters: Alle Buchstaben sollten standardmäßig großgeschrieben werden.

Beispiele

Das folgende Beispiel zeigt, wie man das Kapitalisierungsverhalten für Benutzereingaben über ein Skript steuert:

html

<div>Current capitalization behavior is: <span id="ac-label"></span></div>
<div id="ac-element" contenteditable="true" autocapitalize="default">
  input here
</div>
<select id="ac-controller" type="checkbox" checked>
  <option value="default">default</option>
  <option value="none">none</option>
  <option value="sentences">sentences</option>
  <option value="words">words</option>
  <option value="characters">characters</option></select
>Select the capitalization behavior

const label = document.getElementById("ac-label");
const element = document.getElementById("ac-element");
const controller = document.getElementById("ac-controller");

controller.addEventListener("input", (e) => {
  const behavior = e.target.value;
  label.textContent = behavior;
  element.autocapitalize = behavior;
});

Spezifikationen

Specification
HTML # dom-autocapitalize-dev

Browser-Kompatibilität

Siehe auch

autocapitalize globales HTML-Attribut