HTMLElement : propriété autocorrect

Valeur

true si la correction automatique est activée pour l'élément, sinon false.

Exemples

Activer et désactiver la correction automatique

Cet exemple montre comment activer et désactiver la correction automatique.

HTML

Le balisage HTML définit un bouton d'activation et un élément <input> de type="search". Notez que si la correction automatique est prise en charge, elle sera activée par défaut.

<button id="toggleAutocorrect">Inconnu</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

Le code vérifie d'abord si la propriété autocorrect est prise en charge en vérifiant sa présence sur le prototype de HTMLElement. Si elle est présente, un gestionnaire de clic est ajouté pour permettre d'activer ou de désactiver la valeur. Si elle n'est pas présente, l'interface masque les éléments interactifs et indique que autocorrect n'est pas pris en charge.

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

function setButtonText() {
  toggleButton.textContent = searchInput.autocorrect ? "Activée" : "Désactivée";
  log(`correction automatique : ${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("correction automatique non prise en charge");
}

Résultat

Activez le bouton pour basculer la valeur de la correction automatique. Saisissez un texte erroné dans la zone de texte, comme « Carot ». Lorsque la correction automatique est activée, et si l'implémentation propose le mot de remplacement « carotte », le texte devrait être corrigé automatiquement.

Spécifications

Compatibilité des navigateurs

Voir aussi

• L'attribut HTML universel autocapitalize