ElementInternals: setValidity() メソッド
Baseline
Widely available
This feature is well established and works across many devices and browser versions. It’s been available across browsers since 2023年3月.
setValidity() は ElementInternals インターフェイスのメソッドで、この要素の妥当性を設定します。
構文
setValidity(flags)
setValidity(flags, message)
setValidity(flags, message, anchor)
引数
flags省略可-
要素の有効状態を示す、 1 つ以上のフラグを含む辞書オブジェクトです。
valueMissing-
論理値で、要素に
required属性があって値がない場合はtrueとなり、そうでない場合はfalseとなります。もしtrueなら、その要素は CSS の:invalidの擬似クラスに一致します。 typeMismatch-
論理値で、値が必要とされる構文でない場合(
typeがemailまたはurlの場合)はtrueとなり、構文が正しい場合はfalseとなります。trueの場合、その要素は CSS の:invalidの擬似クラスに一致します。 patternMismatch-
論理値で、指定された
patternに一致しない場合はtrueとなり、一致する場合はfalseとなります。trueの場合、その要素は CSS の:invalidの擬似クラスに一致します。 tooLong-
論理値で、値が
HTMLInputElementまたはHTMLTextAreaElementオブジェクトで指定されたmaxlengthを超える場合はtrueとなり、最大の長さ以下の場合はfalseとなります。trueの場合、その要素は CSS の:invalidおよび:out-of-range擬似クラスに一致します。 tooShort-
論理値で、値が
HTMLInputElementまたはHTMLTextAreaElementオブジェクトで指定されたminlengthに満たない場合はtrueとなり、最小の長さ以上の場合はfalseとなります。trueの場合、その要素は CSS の:invalidおよび:out-of-range擬似クラスに一致します。 rangeUnderflow-
論理値で、値が
min属性で指定された最小値より小さい場合はtrueとなり、最小値以上の場合はfalseとなります。trueの場合、要素は CSS の:invalidおよび:out-of-range擬似クラスに一致します。 rangeOverflow-
論理値で、値が
max属性で指定された最大値より大きい場合はtrueとなり、最大値以下であればfalseとなります。trueの場合、要素は CSS の:invalidおよび:out-of-range擬似クラスに一致します。 stepMismatch-
論理値で、値が
step属性によって決定されるルールに適合しない(つまり、ステップ値で均等に割り切れない)場合はtrueとなり、ステップのルールに適合する場合はfalseとなります。trueの場合、要素は CSS の:invalidおよび:out-of-range擬似クラスに一致します。 badInput-
論理値で、ブラウザーが変換できない入力をユーザーが入力した場合に
trueとなります。 customError-
論理値で、この要素の
setCustomValidity()メソッドを呼び出すことで、要素のカスタム有効性メッセージが空でない文字列に設定されたかどうかを示します。
メモ: すべてのフラグを
falseに設定し、この要素がすべての制約の検証に合格したことを示すには、空のオブジェクト{}を渡してください。この場合、messageも渡す必要はありません。 message省略可-
flagsがtrueの場合に設定されるメッセージを含む文字列。すべてのflagsがfalseの場合のみ、この引数はオプションとなります。 anchor省略可-
このフォーム送信に関する問題を報告するためにユーザーエージェントが使用する
HTMLElementです。
返値
なし (undefined)。
例外
NotSupportedErrorDOMException-
要素の
formAssociatedプロパティがtrueに設定されていない場合に発生します。 TypeError-
1 つ以上の
flagsがtrueの場合に発生します。 NotFoundErrorDOMException-
anchorが与えられているが、そのアンカーが要素のシャドウを含む子孫でない場合に発生します。
例
次の例では、 setValidity を空の flags 引数を指定して呼び出して、この要素が制約検証ルールを満たしていることを示します。
this.internals_.setValidity({});
次の例では、 valueMissing フラグを true に設定して setValidity を呼び出しています。その際、 message 引数にメッセージを渡す必要があります。
this.internals_.setValidity({ valueMissing: true }, "my message");
仕様書
| Specification |
|---|
| HTML> # dom-elementinternals-setvalidity> |
ブラウザーの互換性
Loading…