記事

<optgroup>~</optgroup>

optgroup（オプショングループ）要素はselect要素とoption要素によって作成されるプルダウンメニューにおいて、その選択肢を任意のグループのまとめられる。

これにより、選択肢が多いプルダウンメニューでの視認性や操作性を向上させることができる。

使用方法

• select要素の子要素として使う。
• optgroup要素は、選択式メニュー（select要素）における選択肢（option要素）をグループ化する要素になる。
• optgroup要素内に、選択肢を表すoption要素を配置し、グループ化する。
• グループ名は、必須属性であるlabel属性に指定する。

optgroup要素で使用できる属性

グローバル属性

disabled属性

フォームの入力コントロールやコマンドなどを無効にする。論理属性。

label属性

選択肢のグループにラベルを指定する。からではない文字列を指定する必要がある。必須属性。

使用例

<form action="select-optgroup.php" method="post" target="_blank">

  <p>
    選択肢： 
    <select name="sampleName">

      <optgroup label="グループＡ">
        <option>選択肢１</option>
        <option>選択肢２</option>
	<option>選択肢３</option>
      </optgroup>

      <optgroup label="グループＢ">
        <option>選択肢４</option>
	<option>選択肢５</option>
	<option>選択肢６</option>
      </optgroup>

      <optgroup label="グループＣ">
        <option>選択肢７</option>
	<option>選択肢８</option>
	<option>選択肢９</option>
      </optgroup>

    </select>
  </p>

  <p>
    <button type="submit">送信</button>
  </p>

</form>

表示