web-dev-qa-db-ja.com

選択必須属性を使用したHTML5検証エラー

selectで次のコードを使用します。

<select name="province" id="province" required="required"> 
    <optgroup label="Provinces">
         <option value="Alberta">Alberta</option>
         <option value="British Colombia">British Colombia</option>
         <option value="Manitoba">Manitoba</option>
         <option value="New Brunswick">New Brunswick</option>
         <option value="Newfoundland and Labrador">Newfoundland and Labrador</option>
         <option value="Nova Scotia">Nova Scotia</option>
         <option value="Ontario" selected="selected">Ontario</option>
         <option value="Prince Edward Island">Prince Edward Island</option>
         <option value="Quebec">Quebec</option>
         <option value="Saskatchewan">Saskatchewan</option>
    </optgroup>
         <optgroup label="Territories">
         <option value="Northwest Territories">Northwest Territories</option>
         <option value="Nunavut">Nunavut</option>
         <option value="Yukon">Yukon</option>
    </optgroup>
</select>   

ガイドラインで要求されているオプションと同じ値が必要です。このコードは正常に機能しますが、W3C検証に合格しません。

select属性を持ち、required属性を持たない、サイズが1のmultiple要素には、子option要素が必要です。

この問題の解決策は何ですか?

19
Sobasofly

以下を使用してください

<option value="">Choose</option>

上記のシリーズを最初のオプションとして追加

  • 最初の子要素にはコンテンツがないため、有効と見なされます。
31
Pandiyan Cool

W3C HTML Checker(別名バリデーター)のメンテナーはこちら。

バリデーターを渡すには、改行しないスペースを使用する必要があるようです。

<option value="">&nbsp;</option>

はい、チェッカーでいつ変更したかわかりません。ここ数年は何も変更しなかったと思っていましたが、とにかく、チェッカーはこれに関するHTML仕様に準拠しています。 https://html.spec.whatwg.org/multipage /forms.html#the-option-element を読み、そのセクションの先頭にあるContent modelサブセクションを読んでください。

要素にラベル属性がない場合:要素間の空白ではないテキスト。

HTMLでは、 文字をinter-element whitespace文字にすることができる定義 には、U + 0020(スペース)、タブ、U + 000A(LF)、U + 000C FORM FEED、およびU +のみが含まれます。 000D(CR)。

言い換えれば、HTMLは本質的に、改行しないスペース文字をスペース文字ではなくテキストと見なします。したがって、option要素内に配置すると、そのoption要素が「空ではなくなります」(仕様に関する限り)。

したがって、<option value="">&nbsp;</option>を実行することは、実際にはハックではありません。代わりに、optionを空にしないことは完全に合理的な方法です(再び、仕様に関する限り)。

19
sideshowbarker

空のオプションが必要な場合があります。以前は1つのスペースを挿入するだけで、w3cバリデーターはそれを受け入れました。これは以前は機能していました:

<option value=""> </option>

バリデーターを渡すには、改行しないスペースを使用する必要があるようです。

<option value="">&nbsp;</option>
13
Ryan