ValidityState.valid - 検証をパスしたか?
公開日:
ValidityState.validは、ValidityStateのプロパティです。全ての検証をパスして入力内容に問題がない場合に、true
を返します。このプロパティは読み取り専用です。
概要
IDL
readonly attribute boolean valid;
脚注
boolean
真偽値(true
かfalse
)。
readonly
読み取り専用のため、値を代入できません。
仕様書
https://html.spec.whatwg.org/multipage/forms.html#validitystate
説明
validは、入力内容が問題ない場合にtrue
を返します。
HTML
<form action="./form.php">
<input id="hoge" name="foo" value="SYNCER" required>
<input id="fuga" name="bar" value="" required>
<button>内容を送信</button>
</form>
JavaScript
// プロパティの取得
document.getElementById( "hoge" ).valid ; // true
document.getElementById( "fuga" ).valid ; // false
サンプルコード
HTML
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>【デモ】ValidityState.valid - 検証をパスしたか?</title>
<link rel="canonical" href="https://syncer.jp/Web/API_Interface/Reference/IDL/ValidityState/valid/">
<meta content="width=device-width,initial-scale=1.0" name="viewport">
<style>
body {
background-color: #fff ;
}
pre {
font-family: Arial ;
}
b:not( :nth-of-type(10) ) {
font-weight: 400 ;
}
</style>
</head>
<body>
<form action="/php/form/1.php">
<input id="hoge" name="fuga" value="SYNER" required>
<button>内容を送信</button>
</form>
<hr>
<pre><b>badInput</b>: <span class="valid"></span>
<b>customError</b>: <span class="valid"></span>
<b>patternMismatch</b>: <span class="valid"></span>
<b>rangeOverflow</b>: <span class="valid"></span>
<b>rangeUnderflow</b>: <span class="valid"></span>
<b>stepMismatch</b>: <span class="valid"></span>
<b>tooLong</b>: <span class="valid"></span>
<b>tooShort</b>: <span class="valid"></span>
<b>typeMismatch</b>: <span class="valid"></span>
<b>valid</b>: <span class="valid"></span>
<b>valueMissing</b>: <span class="valid"></span></pre>
<script>
// 要素の取得
var element = document.getElementById( "hoge" ) ;
// ValidityStateの取得
var state = element.validity ;
// コールバック関数
function _result () {
// 結果の確認
for ( var a=[ "badInput", "customError", "patternMismatch", "rangeOverflow", "rangeUnderflow", "stepMismatch", "tooLong", "tooShort", "typeMismatch", "valid", "valueMissing" ], b=document.getElementsByClassName( "valid" ), i=0, l=a.length; l>i; i++ ) {
b[i].textContent = state[ a[i] ] ;
b[i].style.color = ( state[ a[i] ] ) ? "red" : "blue" ;
}
console.log( "ValidityState: ", state ) ;
}
// 入力イベント
element.oninput = _result ;
// 初期状態の結果を表示
_result () ;
</script>
</body>
</html>
デモ
サポート状況
ValidityState.validのサポート状況です。
ブラウザ | サポート状況 | ブラウザ | サポート状況 |
---|---|---|---|
Chrome | Supported | Firefox | Supported |
Edge | Supported | Internet Explorer | Supported 10+ |
Safari | Supported 5.1+ | Opera | Supported |
iOS Safari | Supported | Android | Supported |
Chrome
バージョン | サポート状況 | 公開時期 | シェア |
---|---|---|---|
57 | Supported | 2017年3月頃 | 0.1% |
56 | Supported | 2017年1月頃 | 12.02% |
55 | Supported | 2016年12月頃 | 12.36% |
54 | Supported | 2016年10月頃 | 0.44% |
53 | Supported | 2016年9月頃 | 0.25% |
52 | Supported | 2016年7月頃 | 0.27% |
51 | Supported | 2016年6月頃 | 0.4% |
50 | Supported | 2016年4月頃 | 0.32% |
49 | Supported | 2016年3月頃 | 0.47% |
48 | Supported | 2016年1月頃 | 0.02% |
47 | Supported | 2015年12月頃 | 0.06% |
46 | Supported | 2015年10月頃 | 0.56% |
45 | Supported | 2015年9月頃 | 0.01% |
44 | Supported | 2015年7月頃 | 0.83% |
43 | Supported | 2015年5月頃 | 0.05% |
42 | Supported | 2015年4月頃 | 0.05% |
41 | Supported | 2015年3月頃 | 0.01% |
40 | Supported | 2015年1月頃 | 0.59% |
39 | Supported | 2014年11月頃 | 0.02% |
38 | Supported | 2014年10月頃 | 0.08% |
37 | Supported | 2014年8月頃 | 0.01% |
36 | Supported | 2014年7月頃 | 0.01% |
35 | Supported | 2014年5月頃 | 0.01% |
34 | Supported | 2014年4月頃 | 0.14% |
33 | Supported | 2014年2月頃 | 0.01% |
32 | Supported | 2014年1月頃 | 0% |
31 | Supported | 2013年11月頃 | 0.01% |
30 | Supported | 2013年10月頃 | 0.03% |
29 | Supported | 2013年8月頃 | 0% |
28 | Supported | 2013年6月頃 | 0.03% |
27 | Supported | 2013年5月頃 | 0.01% |
26 | Supported | 2013年3月頃 | 0% |
25 | Supported | 2013年2月頃 | 0% |
24 | Supported | 2013年1月頃 | 0% |
23 | Supported | 2012年11月頃 | 0% |
22 | Supported | 2012年9月頃 | 0% |
21 | Supported | 2012年7月頃 | 0% |
20 | Supported | 2012年6月頃 | 0% |
19 | Supported | 2012年5月頃 | 0% |
18 | Supported | 2012年3月頃 | 0.01% |
17 | Supported | 2012年2月頃 | 0.01% |
16 | Supported | 2011年12月頃 | 0% |
15 | Supported | 2011年10月頃 | 0% |
14 | Supported | 2011年9月頃 | 0% |
Firefox
バージョン | サポート状況 | 公開時期 | シェア |
---|---|---|---|
52 | Supported | 2017年3月頃 | 0.12% |
51 | Supported | 2017年1月頃 | 1.7% |
50 | Supported | 2016年11月頃 | 0.78% |
49 | Supported | 2016年9月頃 | 0.02% |
48 | Supported | 2016年8月頃 | 0.07% |
47 | Supported | 2016年6月頃 | 0.03% |
46 | Supported | 2016年4月頃 | 0.01% |
45 | Supported | 2016年3月頃 | 0.1% |
44 | Supported | 2016年1月頃 | 0.01% |
43 | Supported | 2015年12月頃 | 0.02% |
42 | Supported | 2015年11月頃 | 0.01% |
41 | Supported | 2015年9月頃 | 0% |
40 | Supported | 2015年8月頃 | 0.02% |
39 | Supported | 2015年7月頃 | 0.01% |
38 | Supported | 2015年5月頃 | 0.02% |
37 | Supported | 2015年3月頃 | 0% |
36 | Supported | 2015年2月頃 | 0.01% |
35 | Supported | 2015年1月頃 | 0% |
34 | Supported | 2014年12月頃 | 0.01% |
33 | Supported | 2014年10月頃 | 0% |
32 | Supported | 2014年9月頃 | 0% |
31 | Supported | 2014年7月頃 | 0.01% |
30 | Supported | 2014年6月頃 | 0% |
29 | Supported | 2014年4月頃 | 0% |
28 | Supported | 2014年3月頃 | 0.01% |
27 | Supported | 2014年2月頃 | 0% |
26 | Supported | 2013年12月頃 | 0% |
25 | Supported | 2013年10月頃 | 0% |
24 | Supported | 2013年9月頃 | 0% |
23 | Supported | 2013年8月頃 | 0% |
22 | Supported | 2013年6月頃 | 0% |
21 | Supported | 2013年5月頃 | 0% |
20 | Supported | 2013年4月頃 | 0% |
19 | Supported | 2013年2月頃 | 0% |
18 | Supported | 2013年1月頃 | 0% |
17 | Supported | 2012年11月頃 | 0% |
16 | Supported | 2012年10月頃 | 0% |
15 | Supported | 2012年8月頃 | 0% |
14 | Supported | 2012年7月頃 | 0% |
13 | Supported | 2012年6月頃 | 0% |
12 | Supported | 2012年4月頃 | 0% |
11 | Supported | 2012年3月頃 | 0% |
10 | Supported | 2012年1月頃 | 0% |
9 | Supported | 2011年12月頃 | 0% |
8 | Supported | 2011年11月頃 | 0% |
7 | Supported | 2011年9月頃 | 0% |
6 | Supported | 2011年8月頃 | 0% |
5 | Supported | 2011年6月頃 | 0% |
4 | Supported | 2011年3月頃 | 0% |
Edge
バージョン | サポート状況 | 公開時期 | シェア |
---|---|---|---|
14 | Supported | 2016年2月頃 | 1.05% |
13 | Supported | 2015年9月頃 | 0.08% |
Internet Explorer
バージョン | サポート状況 | 公開時期 | シェア |
---|---|---|---|
11 | Supported | 2013年10月頃 | 4.99% |
10 | Supported | 2012年8月頃 | 0.09% |
9 | Not Supported | 2011年3月頃 | 0.18% |
8 | Not Supported | 2009年3月頃 | 0.04% |
7 | Not Supported | 2006年10月頃 | 0.01% |
6 | Not Supported | 2001年8月頃 | 0% |
Safari
バージョン | サポート状況 | 公開時期 | シェア |
---|---|---|---|
10 | Supported | 2016年10月頃 | 0% |
9.1 | Supported | 2015年9月頃 | 0% |
8.0 | Supported | 2014年10月頃 | 0% |
7.1 | Supported | 2013年10月頃 | 0% |
6.0 | Supported | 2012年7月頃 | 0% |
5.1 | Supported | 2011年7月頃 | 0% |
4 | Not Supported | 2009年6月頃 | 0% |
Opera
バージョン | サポート状況 | 公開時期 | シェア |
---|---|---|---|
43 | Supported | 2017年2月頃 | 0.06% |
42 | Supported | 2016年12月頃 | 0.09% |
41 | Supported | 2016年10月頃 | 0.01% |
40 | Supported | 2016年9月頃 | 0% |
39 | Supported | 2016年8月頃 | 0% |
38 | Supported | 2016年6月頃 | 0% |
37 | Supported | 2016年5月頃 | 0.01% |
36 | Supported | 2016年3月頃 | 0.01% |
35 | Supported | 2016年2月頃 | 0% |
34 | Supported | 2015年12月頃 | 0% |
33 | Supported | 2015年10月頃 | 0% |
32 | Supported | 2015年9月頃 | 0% |
31 | Supported | 2015年8月頃 | 0% |
30 | Supported | 2015年6月頃 | 0% |
29 | Supported | 2015年4月頃 | 0% |
28 | Supported | 2015年3月頃 | 0% |
27 | Supported | 2015年1月頃 | 0% |
26 | Supported | 2014年12月頃 | 0% |
25 | Supported | 2014年10月頃 | 0% |
24 | Supported | 2014年9月頃 | 0% |
23 | Supported | 2014年7月頃 | 0% |
22 | Supported | 2014年6月頃 | 0% |
21 | Supported | 2014年5月頃 | 0.01% |
20 | Supported | 2014年3月頃 | 0% |
19 | Supported | 2014年1月頃 | 0% |
18 | Supported | 2013年11月頃 | 0% |
17 | Supported | 2013年10月頃 | 0% |
16 | Supported | 2013年8月頃 | 0% |
15 | Supported | 2013年7月頃 | 0% |
12 | Supported | 2012年6月頃 | 0.02% |
11.6 | Supported | 2011年12月頃 | 0% |
11.1 | Supported | 2011年4月頃 | 0% |
iOS Safari
バージョン | サポート状況 | 公開時期 | シェア |
---|---|---|---|
10.0 | Supported | 2016年9月頃 | 39.65% |
9.1 | Supported | 2015年9月頃 | 5.39% |
8.3 | Supported | 2014年9月頃 | 1.03% |
7.0 | Supported | 2013年9月頃 | 0.24% |
6.0 | Supported | 2012年9月頃 | 0.05% |
5.1 | Supported | 2011年10月頃 | 0.03% |
Android
バージョン | サポート状況 | 公開時期 | シェア |
---|---|---|---|
4.4 | Supported | 2013年10月頃 | 0% |
4.3 | Supported | 2013年7月頃 | 0% |
4.2 | Supported | 2013年3月頃 | 0.03% |
4.1 | Supported | 2012年12月頃 | 0% |
4.0 | Supported | 2012年6月頃 | 1.61% |
2.3 | Supported | 2011年10月頃 | 0% |