<select> - フォーム部品：セレクト

形式: <select>～</select>
サポート: LS / H2 / e2 / Ch1 / Fx1 / Sa1 / Op1 / N2 / i1
カテゴリ: フローコンテンツ; フレージングコンテンツ; インタラクティブコンテンツ; リステッド, ラベラブル, サブミッタブル, リセッタブル, リアソシエイタブル(HTML 5.2) フォーム関連要素; パルパブルコンテンツ
親要素: フレージングコンテンツを子要素に持てるもの
子要素: 1つ以上の option, optgroup またはスクリプトサポート要素
タグの省略: 開始タグ:必須 / 終了タグ:必須
属性: グローバル属性; autocomplere; disabled; form; multiple; name; required; size

<select> は、<form> で作成されるフォーム内の選択部品(セレクトボックス)を表示します。それぞれの選択肢を記述するには <option> を用います。

グローバル属性: 詳細はグローバル属性を参照してください。
name=name: LS/H5; 名前を指定します。

autocomplete: LS; オートコンプリートを使用するか否かを on または off で指定します。
disabled: LS/H4/e4/Ch/Fx/Sa/Op/N6; この部品を無効にし、入力できない状態にします。
form=id: LS/H5; 関連付けたい form要素のidを指定します。
multiple: LS/H2/e2/Ch/Fx/Sa/Op/N2/i2; 複数行選択を可能にします。Windows の場合は、Ctrl キーや Shift キーを押しながらマウスでクリックすることで複数選択が可能になります。
required: LS/H5/e/Ch/Fx/Op; この情報が必須であることを示します。
size=n: LS/H2/e2/Ch/Fx/Sa/Op/N2/i1; 画面に一度に表示する選択肢の行数を指定します。通常は 1 です。
align=align: [非推奨] e4; 表示位置を指定します。
autofocus: LS/H5/e/Ch/Sa/Op; 自動的にフォーカスを合わせます。初期の HTML Living Standard では <select> 等の属性として定義されていましたが、どの要素でも使用できるよう、グローバル属性に移動しました。

datafld=datafld: [非推奨] e4; データバインド機能を用いる際の、データソースの列名を指定します。
datasrc=datasrc: [非推奨] e4; データバインド機能を用いる際の、データソースの ID を指定します。

HTML

<form method="POST" action="xxx.cgi">
  <select name="OS">
    <option value="Win">Windows</option>
    <option value="Mac">MacOS</option>
    <option value="Lin">Linux</option>
    <option value="OTHER">その他</option>
  </select>
  <input type="submit" value="OK">
</form>

表示

size 属性を指定すると、選択肢を表示する行数を指定できます。

HTML

<form method="POST" action="xxx.cgi">
  <select name="browser" size=5>
    <option value="Ch">Chrome</option>
    <option value="Fx">Firefox</option>
    <option value="Op">Opera</option>
    <option value="Sa">Safari</option>
    <option value="IE8">Internet Explorer 8</option>
    <option value="IE9">Internet Explorer 9</option>
    <option value="IE10">Internet Explorer 10</option>
    <option value="IE11">Internet Explorer 11</option>
  </select>
  <input type="submit" value="OK">
</form>

表示

multiple 属性を指定すると、Ctrl や Shift キーを押しながら選択することで、複数項目の選択を可能とします。複数選択した場合、サーバには、名前=値が複数送信されます。

HTML

<form method="POST" action="xxx.cgi">
  <select name="browser" size=5 multiple>
    <option value="Ch">Chrome</option>
    <option value="Fx">Firefox</option>
    <option value="Op">Opera</option>
    <option value="Sa">Safari</option>
    <option value="IE">Internet Explorer</option>
  </select>
  <input type="submit" value="OK">
</form>

表示

<select> - フォーム部品：セレクト

概要

説明

属性

【重要属性】

【固有属性】

【データバインド関連属性】

使用例

表示桁数(size)

複数選択(miltiple)

関連項目

リンク