HTMLElement: autocorrect-Eigenschaft

Wert

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

Beispiele

Autokorrektur aktivieren und deaktivieren

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

HTML

Das 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.

<button id="toggleAutocorrect">Unknown</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 zunächst, ob autocorrect unterstützt wird, indem überprüft wird, ob es im HTMLElement-Prototyp vorhanden ist. Wenn es vorhanden ist, wird ein Klick-Handler hinzugefügt, um Ihnen das Umschalten des Wertes zu ermöglichen. Wenn es nicht vorhanden ist, versteckt 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 Schaltfläche, 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 passende Ersatzwort "carrot" hat, sollte der Text automatisch korrigiert werden.

Spezifikationen

Browser-Kompatibilität

Siehe auch

• autocapitalize globales HTML-Attribut