ValidityState

ValidityState 인터페이스는 제약 유효성 검사에 대해 요소가 가질 수 있는 유효성 상태를 나타내며, 요소의 값이 유효하지 않은 경우 그 이유에 대한 설명을 도와줍니다.

속성

각각의 Boolean 속성에 대해, true 값은 해당 이유로 인해 값의 유효성 검사를 실패했음을 나타냅니다. valid 속성은 예외로서 true는 모든 제약조건을 통과했음을 의미합니다.

badInput Read only
사용자가 입력한 값을 브라우저가 변환하지 못했음을 나타내는 Boolean 값입니다.
customError Read only
setCustomValidity() 메서드를 사용해 요소의 사용자 지정 유효성 메시지를 비어있지 않은 문자열로 설정했는지를 나타내는 Boolean 값입니다.
patternMismatch Read only
값이 주어진 pattern 특성을 만족하지 못하는지 나타내는 Boolean 값입니다 참일 경우, CSS :invalid 의사 클래스를 만족합니다.
rangeOverflow Read only
값이 주어진 max 특성보다 큰지 나타내는 Boolean 값입니다. 참일 경우, CSS :invalid:out-of-range 의사 클래스를 만족합니다.
rangeUnderflow Read only
값이 주어진 min 특성보다 작은지 나타내는 Boolean 값입니다. 참일 경우, CSS :invalid:out-of-range 의사 클래스를 만족합니다.
stepMismatch Read only
값이 주어진 step 특성의 규칙을 만족하지 않는지 (즉, 값을 스텝 값으로 나눌 수 없는지) 나타내는 Boolean 값입니다. 참일 경우, CSS :invalid:out-of-range 의사 클래스를 만족합니다.
tooLong Read only
값이 HTMLInputElement 또는 HTMLTextAreaElement 객체의 maxlength 값보다 긴지 나타내는 Boolean 값입니다. 참일 경우, CSS :invalid:out-of-range 의사 클래스를 만족합니다.
tooShort Read only
값이 HTMLInputElement 또는 HTMLTextAreaElement 객체의 minLength 값보다 짧은지 나타내는 Boolean 값입니다. 참일 경우, CSS :invalid:out-of-range 의사 클래스를 만족합니다.
typeMismatch Read only
값이 입력 유형에서 요구하는 형식(typeemail이나 url인 경우)에 맞지 않는지 나타내는 Boolean 값입니다. 참일 경우, CSS :invalid 의사 클래스를 만족합니다.
valid Read only
요소가 모든 유효성 제약을 만족하여 유효한 상태인지 나타내는 Boolean 값입니다. 참일 경우 CSS :valid 의사 클래스를, 거짓일 경우 :invalid 의사 클래스를 만족합니다.
valueMissing Read only
요소가 required 특성을 가지고 있지만 값은 없는 경우 참인 Boolean 값입니다. 참일 경우, CSS :invalid 의사 클래스를 만족합니다.

명세

Specification Status Comment
HTML Living Standard
The definition of 'ValidityState' in that specification.
Living Standard Living Standard
HTML 5.1
The definition of 'ValidityState' in that specification.
Recommendation No change from the previous snapshot HTML5.
HTML5
The definition of 'ValidityState' in that specification.
Recommendation First snapshot of  HTML Living Standard containing this interface.

브라우저 호환성

Update compatibility data on GitHub
DesktopMobile
ChromeEdgeFirefoxInternet ExplorerOperaSafariAndroid webviewChrome for AndroidFirefox for AndroidOpera for AndroidSafari on iOSSamsung Internet
ValidityStateChrome Full support 15Edge Full support 12Firefox Full support 4IE Full support 10Opera Full support 12.1Safari Full support 11WebView Android Full support 4Chrome Android Full support YesFirefox Android Full support 64Opera Android Full support 12.1Safari iOS Full support 5Samsung Internet Android Full support Yes
badInputChrome Full support 25Edge Full support 14Firefox Full support 29IE No support NoOpera Full support 15Safari Full support 11WebView Android Full support 4.4Chrome Android Full support YesFirefox Android Full support 64Opera Android Full support 14Safari iOS Full support 7Samsung Internet Android Full support Yes
tooLongChrome Full support 15Edge Full support 12
Notes
Full support 12
Notes
Notes Not supported in the unlikely case of the value being initially set too long, and then changed by the user to a still incorrect state. Per caniuse.com.
Firefox Full support 4
Notes
Full support 4
Notes
Notes Not supported in the unlikely case of the value being initially set too long, and then changed by the user to a still incorrect state. Per caniuse.com.
IE Full support 10Opera Full support 15Safari Full support 11WebView Android Full support 4Chrome Android Full support YesFirefox Android Full support 64Opera Android Full support 14Safari iOS Full support 5Samsung Internet Android Full support Yes
tooShortChrome Full support 40Edge Full support 17Firefox Full support 51IE No support NoOpera Full support 27Safari Full support 11WebView Android Full support 67Chrome Android Full support YesFirefox Android Full support 64Opera Android Full support 27Safari iOS Full support 10Samsung Internet Android Full support Yes

Legend

Full support  
Full support
No support  
No support
See implementation notes.
See implementation notes.

같이 보기