HTML の <option> 要素は、 <select> 要素、<optgroup> 要素、<datalist> 要素内で項目を定義するために使われます。したがって、<option> は HTML 文書でポップアップメニューのメニュー項目や、その他の項目の一覧を表すことができます。

コンテンツカテゴリ なし
許可されている内容 エスケープされた文字 (例えば &eacute;) を含むテキスト
タグの省略 開始タグは必須。直後に他の <option> 要素または <optgroup> 要素がある場合、または親要素が他に内容を持たない場合は終了タグを省略可能。
許可されている親要素 <select> 要素、<optgroup> 要素、<menu> 要素。
許可されている ARIA ロール なし
DOM インターフェイス HTMLOptionElement



この論理属性を設定すると、選択肢が選択不能になります。多くのブラウザーはそのようなコントロールをグレーアウトで表示し、マウスクリックやフォーカスなど、いかなるイベントも受け付けなくなります。この属性を設定していなくても、祖先のいずれかが無効状態の <optgroup> 要素である場合は無効化されます。
この属性は、選択肢の意味を示すラベル文字列です。 label 属性を定義していない場合は、要素の文字列コンテンツが要素の値になります。
この論理属性を設定すると、その選択肢が初期状態で選択されます。<option> 要素が multiple を設定していない <select> 要素の子孫である場合、<select> 要素内で1個の <option> だけが selected 属性を持てます。
この属性の内容は、フォームで送信する値を表します。値を送信するには、選択肢を選択しなければなりません。この属性を省略すると、 option 要素の中の文字列が値になります。

<select> 要素の例をご覧ください。


仕様書 状態 備考
HTML Living Standard
<option> の定義
<option> の定義
HTML 4.01 Specification
<option> の定義
勧告 初回定義


機能ChromeEdgeFirefoxInternet ExplorerOperaSafari
基本対応1 あり1 あり あり あり
disabled1 あり1 あり あり あり
label1 あり11 2 3 あり あり あり
selected1 あり1 あり あり あり
value1 あり1 あり あり あり
機能Android webviewChrome for AndroidEdge mobileFirefox for AndroidOpera AndroidiOS SafariSamsung Internet
基本対応 あり あり あり4 あり あり あり
disabled あり あり あり4 あり あり あり
label あり あり あり41 あり あり あり
selected あり あり あり4 あり あり あり
value あり あり あり4 あり あり あり

1. Firefox doesn't display the value of the label attribute as option text if element's content is empty. See bug 40545.

2. Historically, Firefox has allowed keyboard and mouse events to bubble up from the <option> element to the parent <select> element, although this behavior is inconsistent across many browsers. For better Web compatibility (and for technical reasons), when Firefox is in multi-process mode and the <select> element is displayed as a drop-down list. The behavior is unchanged if the <select> is presented inline and it has either the multiple attribute defined or a size attribute set to more than 1. Rather than watching <option> elements for events, you should watch for change events on <select>. See bug 1090602 for details.

3. When Mozilla introduced dedicated content threads to Firefox (through the Electrolysis, or e10s, project), support for styling <option> elements was removed temporarily. Starting in Firefox 54, you can apply foreground and background colors to <option> elements again, using the color and background-color CSS properties. See bug 910022 for more information. Note that this is still disabled in Linux due to lack of contrast (see bug 1338283 for progress on this).



このページの貢献者: mfuji09, yyss
最終更新者: mfuji09,