ElementInternals: setValidity() メソッド
Baseline 2023
Newly available
Since March 2023, this feature works across the latest devices and browser versions. This feature might not work in older devices or browsers.
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
)。
例外
NotSupportedError
DOMException
-
要素の
formAssociated
プロパティがtrue
に設定されていない場合に発生します。 TypeError
-
1 つ以上の
flags
がtrue
の場合に発生します。 NotFoundError
DOMException
-
anchor
が与えられているが、そのアンカーが要素のシャドウを含む子孫でない場合に発生します。
例
次の例では、 setValidity
を空の flags
引数を指定して呼び出して、この要素が制約検証ルールを満たしていることを示します。
this.internals_.setValidity({});
次の例では、 valueMissing
フラグを true
に設定して setValidity
を呼び出しています。その際、 message
引数にメッセージを渡す必要があります。
this.internals_.setValidity({ valueMissing: true }, "my message");
仕様書
Specification |
---|
HTML Standard # dom-elementinternals-setvalidity |
ブラウザーの互換性
BCD tables only load in the browser