Signatur
Beschreibung
Die Eigenschaft autocomplete spiegelt das gleichnamige HTML-Attribut des <textarea>-Elements als Zeichenkette. Mit ihr legst du fest, ob der Browser früher eingegebene Werte vorschlagen oder gespeicherte Daten automatisch einfügen darf. Die einfachsten Werte sind "on" und "off". Du kannst aber auch Autofill-Bezeichner wie "street-address" angeben, um dem Browser zu sagen, welche Art von Daten erwartet wird.
Typische Einsatzfälle:
- Ein mehrzeiliges Adressfeld (
"shipping street-address"), das der Browser mit gespeicherten Adressen füllen soll. - Vertrauliche Freitextfelder wie Notizen, Einmal-Codes oder Kommentare, bei denen du Vorschläge mit
"off"unterdrücken willst. - Formulare, die erst zur Laufzeit per JavaScript aufgebaut werden und das Verhalten dynamisch festlegen.
Fehlt das Attribut, gibt die Eigenschaft eine leere Zeichenkette zurück. Der Browser übernimmt dann den autocomplete-Wert des umgebenden <form>-Elements, und fehlt der auch, gilt "on". Wenn du der Eigenschaft einen Wert zuweist, ändert sich das Attribut im DOM sofort mit.
Parameter
| Name | Typ | Default | Beschreibung |
|---|---|---|---|
| $value | string | "" | Beim Setzen: "on", "off" oder eine durch Leerzeichen getrennte Liste von Autofill-Bezeichnern, z. B. "section-lieferung shipping street-address". |
Rückgabewert
autocomplete. Ist das Attribut nicht gesetzt, kommt eine leere Zeichenkette "" zurück.Beispiele
Wert auslesen und Standardverhalten prüfen
// HTML: <form autocomplete="off"><textarea id="notiz"></textarea></form>
const notiz = document.querySelector('#notiz');
console.log(JSON.stringify(notiz.autocomplete));
// Tatsächliches Verhalten ergibt sich aus Element oder Formular
const effektiv = notiz.autocomplete || notiz.form?.autocomplete || 'on';
console.log(effektiv);Autovervollständigung für vertrauliche Eingaben abschalten
const kommentar = document.createElement('textarea');
kommentar.name = 'interne-notiz';
kommentar.autocomplete = 'off';
document.body.append(kommentar);
console.log(kommentar.getAttribute('autocomplete'));Mehrzeiliges Adressfeld für Browser-Autofill markieren
const adresse = document.querySelector('textarea[name="adresse"]');
adresse.autocomplete = 'shipping street-address';
adresse.rows = 3;
console.log(adresse.autocomplete);// Wichtig · Fallstricke
Kein Sicherheitsmerkmal: Mit "off" bittest du den Browser nur, keine Vorschläge zu zeigen. Browser und Passwortmanager dürfen das ignorieren. Sensible Daten musst du deshalb zusätzlich auf dem Server schützen.
Leere Zeichenkette ist kein "on": Fehlt das Attribut, liefert die Eigenschaft "". Welches Verhalten tatsächlich gilt, erfährst du erst, wenn du auch form.autocomplete prüfst.
Kein Prüfen der Werte: Du kannst jeden beliebigen Text zuweisen. Ungültige Bezeichner werfen keinen Fehler, der Browser ignoriert sie einfach.
Kompatibilität: Chrome, Edge und Firefox unterstützen die Eigenschaft schon lange. Safari erst seit Version 16 (2022). Wie gut Autofill-Bezeichner bei <textarea> tatsächlich ausgefüllt werden, unterscheidet sich je nach Browser. Am sinnvollsten ist bei mehrzeiligen Feldern street-address.