HTMLElement: autocorrect プロパティ
Limited availability
This feature is not Baseline because it does not work in some of the most widely-used browsers.
autocorrect
は HTMLElement
インターフェイスのプロパティで、編集可能なテキストの綴りや句読点の誤りを自動修正するかどうかを制御します。
どの単語が置き換えられるかなど、具体的な自動修正の動作は、ユーザーエージェントと端末が提供するサービスによって異なります。 例えば、 macOS では、ユーザーエージェントは登録済みの置き換えテキストや句読点を使用することがあります。 他の端末やブラウザーでは、異なる手法が使用される場合があります。
このプロパティは、HTML のグローバル属性である autocorrect
の値を反映します。
値
この要素で自動修正が有効であれば true
、そうでなければ false
です。
例
自動修正を有効化または無効化
この例では、自動修正を有効または無効にする方法を示しています。
HTML
HTML マークアップは、トグルボタンと <input>
要素の type="search"
型を定義します。
自動修正に対応している場合は、既定で有効になっていることに注意してください。
<button id="toggleAutocorrect"></button>
<input type="search" id="searchinput" />
JavaScript
コードの最初のチェックでは、 autocorrect
が HTMLElement
プロトタイプに存在するかどうかを確認することで、対応しているかどうかをチェックします。
存在する場合は、クリックハンドラーを追加し、値の切り替えが可能になります。
存在しない場合は、 UI の対話要素が非表示になり、 autocorrect
が対応していないことがログ出力されます。
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");
}
結果
ボタンを有効にして、自動修正の値を切り替えます。 テキストボックスに "Carot" などの不正なテキストを入力します。 自動修正が有効になっており、実装が適切な代替語 "carrot" がある場合、テキストは自動的に修正されるはずです。
仕様書
Specification |
---|
HTML # dom-autocorrect |
ブラウザーの互換性
関連情報
autocapitalize
HTML グローバル属性