選択肢フィールドに項目を配置します。 <SELECT>と</SELECT>の間に記述することができます。 <OPTGROUP>タグにより、項目をグループ化することができます。

書式

<option attribute="value"...>text</option>
<option label="value" value="value" attribute="value".../>

HTML では終了タグを省略できます。XHTML では省略できません。開始タグと終了タグの間には文字列が現れます。

属性

HTML5の場合、属性名は大文字と小文字を区別しない。XHTMLの場合、属性名は小文字で記述する。

OPTION要素タイプの属性はすべて省略可能である。

class
スタイルシートのクラス
dir
方向
disabled
省略可能。この属性を指定すると、選択不可能になります。 disabled属性を指定したoption要素は、ユーザの入力を受け付けない。このとき、ブラウザによっては入力を受け付けないことを示すために灰色表示になることがある。また、フォーカスの受け手とならず、タブ移動で飛び越される。disabled属性を指定したoption要素の値は、サブミット時にフォームデータを送信しない。
id
要素の識別子
label
選択肢に表示する文字列を指定します。label属性を省略すると、<option>と</option>の間の文字列が表示されます。 Internet Explorer 6 ではlabel属性を指定しても選択肢には表示されないようです。
lang
言語
onclick
マウスがクリックされたときに実行するスクリプト
ondblclick
マウスがダブルクリックされたときに実行するスクリプト
onkeydown
キーを押したときに実行するスクリプト
onkeypress
キーを押して離したときに実行するスクリプト
onkeyup
キーを離したときに実行するスクリプト
onmousedown
マウスのボタンが押下されたときに実行するスクリプト
onmousemove
マウスポインタを要素内で動かしたときに実行するスクリプト
onmouseout
マウスポインタを要素内から要素外に動かしたときに実行するスクリプト
onmouseover
マウスカーソルが乗ったときに実行するスクリプト
onmouseup
マウスのボタンが離されたときに実行するスクリプト
selected
この属性を指定すると、あらかじめ選択された状態になります。

HTML5の場合、属性名及び属性値は大文字と小文字を区別しない。属性値は省略できる。

selected
SELECTED=""
Selected="selected"

XHTMLの場合、属性名及び属性値は小文字で指定する。属性値は省略できない。

selected="selected"
style
スタイルシート
title
タイトル
value
この選択肢が選択された場合の値を指定します。value属性を省略すると、<option>と</option>の間の文字列が選択されたときの値となります。

DTD

HTMLの各要素はDTDによって定義されています。option要素がDTDでどのように定義されているかを見るには、次のリンクをクリックしてください。

HTMLタグ <option> の使用例と表示サンプルを次に示します。表示結果はブラウザによって異なることがあります。

<select name="lang">
  <option value="en">英語</option>
  <option value="es" disabled>スペイン語</option>
  <option value="zh">中国語</option>
  <option value="ja" selected>日本語</option>
  <option value="ru">ロシア語</option>
</select>

上記のHTMLは次のように記述することもできる。

<select name="lang">
  <option value="en" label="英語"/>
  <option value="es" label="スペイン語" disabled="disabled"/>
  <option value="zh" label="中国語"/>
  <option value="ja" label="日本語" selected="selected"/>
  <option value="ru" label="ロシア語"/>
</select>
このエントリーをはてなブックマークに追加
スポンサーリンク