Start · Sprachen · JavaScript · Referenz · HTMLElement.autocorrect

HTMLElement.autocorrect

Eigenschaft

Boolesche Eigenschaft, die steuert, ob der Browser oder das Betriebssystem bearbeitbaren Text beim Tippen automatisch auf Rechtschreib- und Zeichensetzungsfehler korrigiert.

seit JavaScript Eingeschränkt: Safari 18.4+ (iOS/macOS), Firefox 1 Kategorie: webapi

Signatur

HTMLElement.autocorrect

Beschreibung

Die Eigenschaft autocorrect spiegelt das HTML-Attribut autocorrect wider. Sie gibt an, ob Tippfehler in bearbeitbarem Text beim Eingeben automatisch korrigiert werden dürfen. Das betrifft <input>-Felder (z. B. type="text" und type="search"), <textarea> und Elemente mit contenteditable. Welche Korrekturen genau passieren, hängt vom Browser und vom Betriebssystem ab. Am deutlichsten merkt man das auf Touch-Tastaturen wie der von iOS.

Im HTML hat das Attribut die Werte "on" (oder ein leerer String) und "off". Die JavaScript-Eigenschaft ist dagegen ein Boolean. true setzt das Attribut auf "on", false setzt es auf "off". Beim Lesen erhältst du den tatsächlich wirksamen Zustand. Fehlt das Attribut, wird der Wert vom nächsten Vorfahren oder vom Formular übernommen, zu dem das Element gehört. Ist nirgends etwas festgelegt, ist die Autokorrektur standardmäßig eingeschaltet.

Schalte die Autokorrektur überall dort ab, wo sie Eingaben verfälschen würde: bei Benutzernamen, Produktcodes, Gutscheincodes, Eigennamen, Code-Editoren oder Suchfeldern mit Fachbegriffen. Die Rechtschreibprüfung (spellcheck) und die automatische Großschreibung (autocapitalize) sind davon unabhängig und müssen einzeln eingestellt werden.

Rückgabewert

Typ
boolean
Beschreibung
true, wenn die Autokorrektur für das Element wirksam eingeschaltet ist, sonst false. Beim Setzen wird das Attribut autocorrect auf "on" bzw. "off" gesetzt.

Beispiele

Autokorrektur für ein Benutzernamen-Feld abschalten

// HTML: <input id="username" type="text">
const username = document.querySelector('#username');

username.autocorrect = false;      // Autokorrektur aus
username.autocapitalize = 'none';  // keine automatische Großschreibung
username.spellcheck = false;       // keine rote Unterstreichung

console.log(username.autocorrect);
console.log(username.getAttribute('autocorrect'));
false off

Wert von einem Formular übernehmen

// HTML:
// <form id="code-form" autocorrect="off">
//   <input id="voucher" type="text">
//   <textarea id="comment" autocorrect="on"></textarea>
// </form>
const voucher = document.querySelector('#voucher');
const comment = document.querySelector('#comment');

// voucher hat kein eigenes Attribut und übernimmt "off" vom Formular
console.log(voucher.autocorrect);
// comment überschreibt den Wert des Formulars
console.log(comment.autocorrect);
false true

Code-Editor mit contenteditable und Feature-Erkennung

const editor = document.createElement('div');
editor.contentEditable = 'true';
editor.spellcheck = false;

if ('autocorrect' in HTMLElement.prototype) {
  editor.autocorrect = false;
} else {
  // Fallback: Attribut direkt setzen (ältere iOS-Safari werten es aus)
  editor.setAttribute('autocorrect', 'off');
}

document.body.append(editor);
console.log(editor.getAttribute('autocorrect'));
off

Autokorrektur per Checkbox umschalten

// HTML: <textarea id="notes"></textarea>
//       <label><input id="ac" type="checkbox" checked> Autokorrektur</label>
const notes = document.querySelector('#notes');
const toggle = document.querySelector('#ac');

toggle.addEventListener('change', () => {
  notes.autocorrect = toggle.checked;
  console.log(`Autokorrektur: ${notes.autocorrect ? 'an' : 'aus'}`);
});
Autokorrektur: aus (nach dem Abwählen der Checkbox)

// Wichtig · Fallstricke

  • Browser-Unterstützung: Die Eigenschaft ist noch nicht in allen Browsern verfügbar. Safari (vor allem auf iOS) wertet das Attribut schon lange aus, die IDL-Eigenschaft gibt es erst in neueren Versionen. Firefox unterstützt sie ab Version 136. In Chromium-Browsern fehlt die Eigenschaft bislang. Prüfe die Unterstützung mit 'autocorrect' in HTMLElement.prototype und setze notfalls das Attribut mit setAttribute('autocorrect', 'off').
  • Boolean statt String: Die Eigenschaft erwartet true oder false. Bei el.autocorrect = 'off' wird der String in einen Boolean umgewandelt. Jeder nicht leere String ergibt true, die Autokorrektur wird also eingeschaltet.
  • Nicht korrigierbare Feldtypen: Bei <input> mit type="password", "email" oder "url" findet nie eine Autokorrektur statt, unabhängig vom gesetzten Wert.
  • Nur ein Hinweis: Das Attribut ist eine Empfehlung an den Browser. Auf Desktop-Systemen zeigt es oft keine sichtbare Wirkung, und Tastatur-Apps von Drittanbietern können es ignorieren.
  • Die Eigenschaft hängt nicht mit spellcheck (rote Unterstreichung) oder autocomplete (Vorschläge zum Ausfüllen) zusammen. Setze diese Eigenschaften bei Bedarf zusätzlich.