HTMLElement: autocorrect-Eigenschaft

Experimentell: Dies ist eine experimentelle Technologie
Überprüfen Sie die Browser-Kompatibilitätstabelle sorgfältig, bevor Sie diese produktiv verwenden.

Die autocorrect-Eigenschaft des HTMLElement-Interfaces steuert, ob die Autokorrektur des bearbeitbaren Textes für Rechtschreib- und/oder Zeichensetzungsfehler aktiviert ist oder nicht.

Das spezifische Verhalten der Autokorrektur, einschließlich der ersetzten Wörter, hängt vom Benutzeragenten und den vom zugrunde liegenden Gerät bereitgestellten Diensten ab. Auf macOS könnte sich ein Benutzeragent beispielsweise auf registrierten Ersetzungstext und Zeichensetzung stützen. Andere Geräte und Browser können einen anderen Ansatz verwenden.

Diese Eigenschaft spiegelt den Wert des globalen HTML-Attributs autocorrect wider.

Wert

true, wenn die Autokorrektur für das Element aktiviert ist, andernfalls false.

Beispiele

Autokorrektur aktivieren und deaktivieren

Dieses Beispiel zeigt, wie Sie die Autokorrektur aktivieren und deaktivieren können.

HTML

Der HTML-Markup definiert eine Umschalttaste und ein <input>-Element des Typs type="search". Beachten Sie, dass, wenn die Autokorrektur unterstützt wird, sie standardmäßig aktiviert ist.

html

<button id="toggleAutocorrect"></button>
<input type="search" id="searchinput" />

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

#log {
  height: 100px;
  overflow: scroll;
  padding: 0.5rem;
  border: 1px solid black;
}

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

JavaScript

Der Code prüft zuerst, ob die autocorrect-Eigenschaft unterstützt wird, indem überprüft wird, ob sie im HTMLElement-Prototyp vorhanden ist. Wenn sie vorhanden ist, wird ein Klick-Handler hinzugefügt, um Ihnen das Umschalten des Wertes zu ermöglichen. Wenn sie nicht vorhanden ist, verbirgt die Benutzeroberfläche die interaktiven Elemente und protokolliert, dass autocorrect nicht unterstützt wird.

const toggleButton = document.querySelector("button");
const searchInput = document.querySelector("#searchinput");

function setButtonText() {
  toggleButton.textContent = searchInput.autocorrect ? "Enabled" : "Disabled";
  log(`autocorrect: ${searchInput.autocorrect}`);
}

if (`autocorrect` in HTMLElement.prototype) {
  setButtonText();

  toggleButton.addEventListener("click", (e) => {
    searchInput.autocorrect = !searchInput.autocorrect;
    setButtonText();
  });
} else {
  toggleButton.hidden = true;
  searchInput.hidden = true;
  log("autocorrect not supported");
}

Ergebnis

Aktivieren Sie die Taste, um den Wert der Autokorrektur umzuschalten. Geben Sie ungültigen Text in das Textfeld ein, wie z.B. "Carot". Wenn die Autokorrektur aktiviert ist und die Implementierung das entsprechende Ersatzwort "carrot" besitzt, sollte der Text automatisch korrigiert werden.

Spezifikationen

Specification
HTML Standard # dom-autocorrect

Browser-Kompatibilität

BCD tables only load in the browser

Siehe auch

autocapitalize globales HTML-Attribut