<option>要素

<option>要素

英語で「選択肢」を意味する”option”より。<select> 要素や <optgroup> 要素、<datalist> 要素内で項目を定義する際に使われます。
例えば、<select> 要素の子要素として使用することで、選択式のメニューの実際の選択肢を定義することが出来ます。
要素内には、選択肢として使用する「テキスト」のみが記載できます。

親要素として使えるもの

<select> 要素、<optgroup> 要素、<datalist> 要素。

許可されているARIAロール

なし

DOMインターフェース

HTMLOptionElement

属性

グローバル属性が指定できます。

disabled

この属性を指定することで、この選択肢を選択不可能にします。

label

オプションにラベル付けする際に使用します。label属性が指定されていない場合は、要素のテキストコンテンツがラベルとなります。

selected

この属性を指定した場合、その選択肢がデフォルトで選択された状態になります。親の <select> 要素に”multiple”属性を指定していない場合は、<select> 要素内の1つの<option>要素だけが選択されます。

value

フォームを送信した際に、実際に送信される値を定義します。省略した場合は、要素のテキストコンテンツが送信されます。

サンプル

See the Pen XWrVxoY by Masahiko Iwakiri (@m-iwakiri) on CodePen.


 

このサイトでは、HTML要素や属性の定義は下記サイトを参考にしています。
MDN Web Docs: https://developer.mozilla.org/ja/
W3C仕様の正確な定義、最新情報は上記サイトをご覧ください。
HTML要素や属性がどのブラウザに対応しているのかは、下記のサイトで確認できます。
Can I Use?: https://caniuse.com/#home

 

コメント

タイトルとURLをコピーしました