web-dev-qa-db-ja.com

「option」タグの「selected」属性に表示できる値は何ですか？

次のようなマークアップがあります。

<select>
  <option selected="selected">Apple</option>
  <option selected="">Orange</option>
</select>

この場合、選択された項目として「オレンジ」が表示されます。 selected属性を空白にすると、その効果が元に戻されます。属性を単純に除外せずにこれを記述する方法はありますか？

htmlxhtmloptionselected
30
Travis Beale

ブラウザごとにこの属性の扱いが異なる場合があります。 MSDNドキュメント（Internet Explorer用）によると：

HTMLでアイテムを選択するために、SELECTED属性の値をtrueに設定する必要はありません。 SELECTED属性が存在するだけで、値がtrueに設定されます。

FirefoxおよびSafariでは、これは機能します。

<option selected='false' />

HTML4の公式WC3標準を見ればわかることから、サポートされるケースは次のとおりです。

<option selected='selected' />

属性を選択的に出力するか、javascriptを使用して最初に選択されるアイテムを制御する必要があります。

32
LBushkin

HTML5仕様

https://www.w3.org/TR/html51/sec-forms.html#the-option-element

選択されたコンテンツ属性はブール属性です。

http://www.w3.org/TR/html5/infrastructure.html#boolean-attributes ：

要素上のブール属性の存在は真の値を表し、属性の不在は偽の値を表します。

属性が存在する場合、その値は、空の文字列か、属性の正規名と大文字と小文字を区別しないASCIIで、先頭または末尾に空白を含まない）の値である必要があります。

結論

以下は、有効、同等、およびtrueです。

<option selected />
<option selected="" />
<option selected="selected" />
<option selected="SeLeCtEd" />

以下はinvalidです。

<option selected="0" />
<option selected="1" />
<option selected="false" />
<option selected="true" />

falseの唯一の有効な構文は、属性がないことです。

<option />

推奨事項

有効なXHTMLの作成を気にする場合は、selected="selected"、以来<option selected>は無効であり、他の選択肢は読みにくいです。そうでない場合は、<option selected>短いので。

26
Ciro Santilli 新疆改造中心996ICU六四事件

xHTMLで選択された属性に許可される値は「selected」のみであるため、マークアップをXHTMLに準拠させ、すべてのブラウザで機能させる場合は、選択を解除する唯一の選択肢です。

7
Rony

いいえ、選択された属性の存在は、それが選択されたアイテムであることをブラウザに伝えます。引用符内のすべては無視されます。

編集：（Javascriptを使用して）できることは、selected = ""が付いたオプションタグを探し、それらから選択された属性を削除することです。

4
jimyi

HTMLでは（XHTMLとは対照的に）値のない単純なselected属性は正常に機能します。

<option selected>Apple</option>
<option>Orange</option>

XHTML（XHTML5を含む）では、値が必要です。これもselectedでなければなりません：

<option selected="selected">Apple</option>
<option>Orange</option>

これはHTMLでも正常に機能します。

これは通常、（X）HTMLのブール値の場合です。それらをfalseに設定する方法は、それらを完全に省略することです。 trueおよびfalseの値を設定することは可能ですが、標準ではありません。

オプションのリストでは、最初のオプションがデフォルトで選択されているため、この場合、これはまったく必要ありません。

2
TRiG

その属性に「選択」以外の有効な値はありません。 （ http://www.w3schools.com/TAGS/att_option_selected.asp ）

0
Chet

w3schools によると、次のように設定する必要があります：selected = "selected"。これにより、最初に選択されたオプションがわかり、後でスクリプトを使用して設定できます。

0
amischiefr