option 要素選択肢を表す
option 要素は select 要素によって作成されるプルダウンメニューの選択肢、または datalist 要素によって提供される入力候補の選択肢を表します。
option 要素の仕様
- カテゴリ
-
- なし
- コンテンツモデル
-
- option 要素が label 属性および value 属性を持つ場合は「空」
- option 要素が label 属性を持つが value 属性を持たない場合は「テキスト」
- option 要素が label 属性を持たない場合は「要素内の空白文字でないテキスト」
- option 要素が label 属性を持たず、かつ datalist 要素の子要素である場合は「テキスト」
- この要素を使用できる文脈
- select 要素の子要素として
- datalist 要素の子要素として
- optgroup 要素の子要素として
- この要素で使用できる属性
詳細説明
option 要素のサンプルソース
<select name="pref"> <option value="">都道府県を選択してください</option> <optgroup label="北海道・東北地方"> <option value="北海道">北海道</option> <option value="青森県">青森県</option> <option value="岩手県">岩手県</option> <option value="宮城県">宮城県</option> <option value="秋田県">秋田県</option> <option value="山形県">山形県</option> <option value="福島県">福島県</option> </optgroup> <optgroup label="関東地方"> <option value="群馬県">群馬県</option> <option value="栃木県">栃木県</option> <option value="茨城県">茨城県</option> <option value="埼玉県">埼玉県</option> <option value="千葉県">千葉県</option> <option value="東京都" selected="selected">東京都</option> <option value="神奈川県">神奈川県</option> </optgroup> <optgroup label="甲信越地方" disabled="disabled"> <option value="山梨県">山梨県</option> …省略… </optgroup> </select>
<!-- value 属性が省略された場合は、要素の内容となるテキストが値として送信されます --> <select name="pref"> <option value="">都道府県を選択してください</option> <optgroup label="北海道・東北地方"> <option>北海道</option> <option>青森県</option> <option>岩手県</option> <option>宮城県</option> <option>秋田県</option> <option>山形県</option> <option>福島県</option> </optgroup> <optgroup label="関東地方"> <option>群馬県</option> <option>栃木県</option> <option>茨城県</option> <option>埼玉県</option> <option>千葉県</option> <option selected="selected">東京都</option> <option>神奈川県</option> </optgroup> <optgroup label="甲信越地方" disabled="disabled"> <option>山梨県</option> …省略… </optgroup> </select>
<!-- label 属性と value 属性を同時に持つ場合、要素の内容は空 --> <select name="pref"> <option label="都道府県を選択してください" value=""></option> <optgroup label="北海道・東北地方"> <option label="北海道" value="北海道"></option> <option label="青森県" value="青森県"></option> <option label="岩手県" value="岩手県"></option> <option label="宮城県" value="宮城県"></option> <option label="秋田県" value="秋田県"></option> <option label="山形県" value="山形県"></option> <option label="福島県" value="福島県"></option> </optgroup> <optgroup label="関東地方"> <option label="群馬県" value="群馬県"></option> <option label="栃木県" value="栃木県"></option> <option label="茨城県" value="茨城県"></option> <option label="埼玉県" value="埼玉県"></option> <option label="千葉県" value="千葉県"></option> <option label="東京都" value="東京都" selected="selected"></option> <option label="神奈川県" value="神奈川県"></option> </optgroup> <optgroup label="甲信越地方" disabled="disabled"> <option label="山梨県" value="山梨県"></option> …省略… </optgroup> </select>
主要ブラウザの対応
| IE11 | ○ |
|---|---|
| Edge（EdgeHTML） | ○ |
| Edge（Chromium） | ○ |
| Chrome | ○ |
| Firefox | ○ |
| Safari | ○ |
| iOS Safari | ○ |
| Android Chrome | ○ |