diff options
author | Masahiro FUJIMOTO <mfujimot@gmail.com> | 2021-03-25 23:58:30 +0900 |
---|---|---|
committer | potappo <potappo@gmail.com> | 2021-03-27 00:33:34 +0900 |
commit | 556d28a0b5bcff49528d20995db1de0ab6117712 (patch) | |
tree | 7c5494dcd30b34e89970f5d0bde92702e80d81a1 /files | |
parent | e90c7dd30f749512a1b30581a6c30da0f69301b7 (diff) | |
download | translated-content-556d28a0b5bcff49528d20995db1de0ab6117712.tar.gz translated-content-556d28a0b5bcff49528d20995db1de0ab6117712.tar.bz2 translated-content-556d28a0b5bcff49528d20995db1de0ab6117712.zip |
Web/API/ValidityState を更新
2020/12/22 時点の英語版に基づき更新
(説明文の内容が英語版と開きがあったので、説明文については全面的に再翻訳)
Diffstat (limited to 'files')
-rw-r--r-- | files/ja/web/api/validitystate/index.html | 75 |
1 files changed, 36 insertions, 39 deletions
diff --git a/files/ja/web/api/validitystate/index.html b/files/ja/web/api/validitystate/index.html index 40f512e57e..03564df464 100644 --- a/files/ja/web/api/validitystate/index.html +++ b/files/ja/web/api/validitystate/index.html @@ -9,76 +9,73 @@ tags: - Interface translation_of: Web/API/ValidityState --- -<div>{{APIRef("HTML DOM")}} {{gecko_minversion_header("2.0")}}</div> +<div>{{APIRef("HTML DOM")}}</div> -<p><strong><code>ValidityState</code></strong> インターフェイスは、制約の検証に関して、要素が持つことになる<em>妥当性の状態</em>を表します。要素の値が不正な場合に、なぜ検証に失敗するのかを知る手がかりにもなります。</p> +<p><strong><code>ValidityState</code></strong> インターフェイスは、制約の検証に関して、要素が取りうる<em>妥当性の状態</em>を表します。要素の値が不正な場合に、なぜ検証に失敗するのかを知る手がかりにもなります。</p> -<h2 id="Properties" name="Properties">プロパティ</h2> +<h2 id="Properties">プロパティ</h2> -<p>下記のプロパティはどれも真偽値を返します。<code>true</code> は指定された検証が失敗したことを表します。ただし <code>valid</code> プロパティの <code>true</code> だけは、要素の値が全ての制約に適合していることを表します。</p> +<p>下記のプロパティはどれも Boolean を返します。<code>true</code> は指定された検証が失敗したことを表します。ただし <strong>valid</strong> プロパティの <code>true</code> だけは、要素の値がすべての制約に適合していることを表します。</p> <dl> - <dt>{{domxref("ValidityState.badInput")}} {{ReadOnlyInline}}</dt> - <dd>入力値をブラウザが処理できないことを示す {{jsxref("Boolean")}} です。</dd> - <dt>{{domxref("ValidityState.customError")}} {{ReadOnlyInline}}</dt> - <dd>その要素のカスタム検証メッセージが、 <code>setCustomValidity()</code> メソッドによって空文字以外に設定されていることを示す {{jsxref("Boolean")}} です。</dd> - <dt>{{domxref("ValidityState.patternMismatch")}} {{ReadOnlyInline}}</dt> - <dd>値が、指定された {{htmlattrxref("pattern", "input")}} と一致しないことを示す {{jsxref("Boolean")}} です。</dd> - <dt>{{domxref("ValidityState.rangeOverflow")}} {{ReadOnlyInline}}</dt> - <dd>値が、 {{htmlattrxref("max", "input")}} 属性で指定された最大値を超えていることを示す {{jsxref("Boolean")}} です。</dd> - <dt>{{domxref("ValidityState.rangeUnderflow")}} {{ReadOnlyInline}}</dt> - <dd>値が、{{htmlattrxref("min", "input")}} 属性で指定された最小値を下回っていることを示す {{jsxref("Boolean")}} です。</dd> - <dt>{{domxref("ValidityState.stepMismatch")}} {{ReadOnlyInline}}</dt> - <dd>値が、{{htmlattrxref("step", "input")}} 属性で決められた規則に合わないことを示す {{jsxref("Boolean")}} です。(つまり、step の値で割り切れないことを表します)</dd> - <dt>{{domxref("ValidityState.tooLong")}} {{ReadOnlyInline}}</dt> - <dd>値が、{{domxref("HTMLInputElement")}} や {{domxref("HTMLTextAreaElement")}} オブジェクトの <code>maxlength</code> を超えていることを示す {{jsxref("Boolean")}} です。<br> - <em><strong>注:</strong> Gecko では <code>maxlength</code> より長い値はそもそも入力できないので、<code>true</code> になることは決してありません。</em></dd> - <dt>{{domxref("ValidityState.tooShort")}} {{ReadOnlyInline}}</dt> - <dd>値が、{{domxref("HTMLInputElement")}} や {{domxref("HTMLTextAreaElement")}} オブジェクトの <code>minlength</code> を下回っていることを示す {{jsxref("Boolean")}} です。</dd> - <dt>{{domxref("ValidityState.typeMismatch")}} {{ReadOnlyInline}}</dt> - <dd>値が、({{htmlattrxref("type", "input")}} が <code>email</code> や <code>url</code> の場合に)求められる構文規則に従っていないことを示す {{jsxref("Boolean")}} です。</dd> - <dt>{{domxref("ValidityState.valid")}} {{ReadOnlyInline}}</dt> - <dd>要素が全ての制約の検証に適合し、有効であることを示す {{jsxref("Boolean")}} です。</dd> - <dt>{{domxref("ValidityState.valueMissing")}} {{ReadOnlyInline}}</dt> - <dd>{{htmlattrxref("required", "input")}} 属性が指定されているのに要素の値がないことを示す {{jsxref("Boolean")}} です。</dd> + <dt>{{domxref("ValidityState.badInput", "badInput")}} {{ReadOnlyInline}}</dt> + <dd>{{jsxref("Boolean")}} で、 <code>true</code> はブラウザーが処理できない入力値をユーザーが入力したことを示します。</dd> + <dt><code>customError</code> {{ReadOnlyInline}}</dt> + <dd>{{jsxref("Boolean")}} で、その要素のカスタム検証メッセージが {{domxref('HTMLObjectElement.setCustomValidity', 'setCustomValidity()')}} メソッドによって空でない文字列に設定されているかどうかを示します。</dd> + <dt>{{domxref("ValidityState.patternMismatch", "patternMismatch")}} {{ReadOnlyInline}}</dt> + <dd>{{jsxref("Boolean")}} で、 <code>true</code> は値が {{htmlattrxref("pattern", "input")}} の指定と一致しないことを示し、 <code>false</code> は一致することを示します。 true の場合、その要素は CSS の {{cssxref(":invalid")}} 擬似クラスに一致します。</dd> + <dt>{{domxref("ValidityState.rangeOverflow", "rangeOverflow")}} {{ReadOnlyInline}}</dt> + <dd>{{jsxref("Boolean")}} で、 true は値が {{htmlattrxref("max", "input")}} 属性で指定された最大値を超えていることを示し、 <code>false</code> はその最大値以下である場合を示します。 true の場合、その要素は CSS の {{cssxref(":invalid")}} および {{cssxref(":out-of-range")}} の各擬似クラスに一致します。</dd> + <dt>{{domxref("ValidityState.rangeUnderflow", "rangeUnderflow")}} {{ReadOnlyInline}}</dt> + <dd>{{jsxref("Boolean")}} で、 <code>true</code> は値が {{htmlattrxref("min", "input")}} 属性で指定された最小値未満であることを示し、 <code>false</code> はその最小値以上であることを示します。 true の場合、その要素は CSS の {{cssxref(":invalid")}} および {{cssxref(":out-of-range")}} の各擬似クラスに一致します。</dd> + <dt>{{domxref("ValidityState.stepMismatch", "stepMismatch")}} {{ReadOnlyInline}}</dt> + <dd>{{jsxref("Boolean")}} で、 <code>true</code> は値が {{htmlattrxref("step", "input")}} 属性で決められた規則に合わないこと (つまり、step の値で割り切れないこと) を示し、 <code>false</code> は刻みの規則に合っていることを示します。 true の場合、その要素は CSS の {{cssxref(":invalid")}} および {{cssxref(":out-of-range")}} の各擬似クラスに一致します。</dd> + <dt>{{domxref("ValidityState.tooLong", "tooLong")}} {{ReadOnlyInline}}</dt> + <dd>{{jsxref("Boolean")}} で、 <code>true</code> は値が {{domxref("HTMLInputElement")}} または {{domxref("HTMLTextAreaElement")}} オブジェクトの <code>maxlength</code> で指定された長さを超えていることを示し、 false は長さがその最長値以下であることを示します。 <em><strong>注:</strong> Gecko ではこのプロパティが <code>true</code> になることはありません。要素の値の長さが <code>maxlength</code> を超えないようになっているからです。</em> true の場合、その要素は CSS の {{cssxref(":invalid")}} および {{cssxref(":out-of-range")}} の各擬似クラスに一致します。</dd> + <dt>{{domxref("ValidityState.tooShort", "tooShort")}} {{ReadOnlyInline}}</dt> + <dd>{{jsxref("Boolean")}} で、 <code>true</code> は値が {{domxref("HTMLInputElement")}} または {{domxref("HTMLTextAreaElement")}} オブジェクトの <code>minlength</code> で指定された長さに満たないことを示し、 <code>false</code> は長さがその最短値以上であることを示します。 true の場合、その要素は CSS の {{cssxref(":invalid")}} および {{cssxref(":out-of-range")}} の各擬似クラスに一致します。</dd> + <dt>{{domxref("ValidityState.typeMismatch", "typeMismatch")}} {{ReadOnlyInline}}</dt> + <dd>{{jsxref("Boolean")}} で、 <code>true</code> は値が ({{htmlattrxref("type", "input")}} が <code>email</code> または <code>url</code> の場合に) 要求された構文に合っていないことを示し、<code>false</code> は構文が正しいことを示します。 true の場合、その要素は CSS の {{cssxref(":invalid")}} 擬似クラスに一致します。</dd> + <dt><code>valid</code> {{ReadOnlyInline}}</dt> + <dd>{{jsxref("Boolean")}} で、 <code>true</code> はその要素がすべての制約検証に適合し、合格したとみられることを示し、 <code>false</code> はいずれかの制約に適合しなかったことを示します。 true の場合、 CSS の {{cssxref(":valid")}} 擬似クラスに一致します。それ以外の場合は CSS の {{cssxref(":invalid")}} 擬似クラスに一致します。</dd> + <dt>{{domxref("ValidityState.valueMissing", "valueMissing")}} {{ReadOnlyInline}}</dt> + <dd>{{jsxref("Boolean")}} で、 <code>true</code> はその要素に {{htmlattrxref("required", "input")}} 属性があるものの、値がないことを示し、 <code>false</code> はそうではないことを示します。 true の場合、その要素は CSS の {{cssxref(":invalid")}} 擬似クラスに一致します。</dd> </dl> -<h2 id="Specifications" name="Specifications">仕様</h2> +<h2 id="Specifications">仕様書</h2> <table class="standard-table"> <tbody> <tr> <th scope="col">仕様書</th> - <th scope="col">策定状況</th> - <th scope="col">コメント</th> + <th scope="col">状態</th> + <th scope="col">備考</th> </tr> <tr> - <td>{{ SpecName('HTML WHATWG', 'forms.html#the-constraint-validation-api', 'ValidityState') }}</td> + <td>{{ SpecName('HTML WHATWG', 'form-control-infrastructure.html#validitystate', 'ValidityState') }}</td> <td>{{Spec2('HTML WHATWG')}}</td> <td>現行の標準</td> </tr> <tr> - <td>{{ SpecName('HTML5.1', '#the-constraint-validation-api', 'ValidityState') }}</td> + <td>{{ SpecName('HTML5.1', 'sec-forms.html#validitystate-validitystate', 'ValidityState') }}</td> <td>{{Spec2('HTML5.1')}}</td> <td>前回のスナップショット {{SpecName('HTML5 W3C')}} から変更なし</td> </tr> <tr> - <td>{{ SpecName('HTML5 W3C', 'forms.html#the-constraint-validation-api', 'ValidityState') }}</td> + <td>{{ SpecName('HTML5 W3C', 'forms.html#validitystate', 'ValidityState') }}</td> <td>{{Spec2('HTML5 W3C')}}</td> <td>このインターフェイスを含む {{SpecName('HTML WHATWG')}} の最初のスナップショット</td> </tr> </tbody> </table> -<h2 id="Browser_compatibility" name="Browser_compatibility">ブラウザー実装状況</h2> - - +<h2 id="Browser_compatibility">ブラウザーの互換性</h2> <p>{{Compat("api.ValidityState")}}</p> -<h2 id="See_also" name="See_also">関連情報</h2> +<h2 id="See_also">関連情報</h2> <ul> - <li><a href="/ja/docs/Web/HTML/HTML5/Constraint_validation">制約の検証</a></li> - <li><a href="/ja/docs/Web/Guide/HTML/Forms/Data_form_validation">フォームデータの検証</a></li> + <li><a href="/ja/docs/Web/Guide/HTML/HTML5/Constraint_validation">ガイド: 制約検証</a></li> + <li><a href="/ja/docs/Learn/Forms/Form_validation">チュートリアル: フォームデータの検証</a></li> </ul> |