フォームでセレクトメニュー（オプションメニュー、プルダウンメニュー）を作成します。
size属性を指定して、２以上になった場合はリストボックス形式のメニューになり、multiple属性で複数選択させることが可能になります。
<SELECT>タグでメニューを定義して、<OPTION>タグで項目を定義します。

属性	値	機能	記述例
size	数値	リストボックスの行数	<SELECT size="4">
name	名前	フィールド名を指定	<SELECT name="myBtn">
multiple	複数の項目を選択可能にする		<SELECT multiple>
disabled	入力・選択不可能にする		<SELECT disabled>
tabindex	数値	タブで移動する順	<SELECT tabindex="2">

<OPTION>タグについて

<SELECT>タグで定義されたメニューに対して項目を作成します。selected属性で、読み込まれた時に選択状態になっている項目を設定します。
また、disabled属性で特定の項目を選択不可能にすることができます。
終了タグは省略することができます。

属性	値	機能	記述例
value	文字列	送信する値	<OPTION value="セレクト">
label	文字	優先して表示	<OPTION lavel="myLabel">
selected	初期設定で選択状態にする		<OPTION selected>
disabled	入力・選択不可能にする		<OPTION disabled>

<OPTGROUP>タグについて

メニューの項目が多くて、複雑な場合は、<OPTGROUP>タグを使ってメニューをグループ化し、整理することができます。
グループ名はlabel属性に記述します。
終了タグは省略することができます。

属性	値	機能	記述例
label	文字	グループ名	<OPGROUP lavel="メニュー１">
disabled	入力・選択不可能にする		<OPGROUP disabled>

サンプル

セレクトメニュー、リストボックス

メニューの作成を行います。

サンプル・ソース

緑の文字が変更箇所で、赤い文字が対応するタグ・属性です。

<H2>セレクトメニュー、リストボックス</H2>
<P>メニューの作成を行います。</P>
<FORM>
<SELECT>
<OPTION value="1">項目１</OPTION>
<OPTION value="2" selected>項目２</OPTION>
<OPTION value="3">項目３</OPTION>
<OPTION value="4">項目４</OPTION>
<OPTION value="5">項目５</OPTION>
</SELECT>
<P>リストボックスの作成を行います。複数選択可能です。</P>
<SELECT size="6" multiple>
<OPTION value="1">項目１</OPTION>
<OPTION value="2" selected>項目２</OPTION>
<OPTION value="3">項目３</OPTION>
<OPTION value="4">項目４</OPTION>
<OPTION value="5">項目５</OPTION>
</SELECT>
<P>セレクトメニューのグループ化を行います。</P>
<SELECT>
<OPTGROUP label="グループ１">
<OPTION value="1">項目１</OPTION>
<OPTION value="2">項目２</OPTION>
<OPTION value="3">項目３</OPTION>
</OPTGROUP>
<OPTGROUP label="グループ２">
<OPTION value="4">項目４</OPTION>
<OPTION value="5">項目５</OPTION>
</OPTGROUP>
</SELECT>
</FORM>

解説・注意点など

リストボックスで複数選択する場合は、Windowの場合Ctrlキーを押しながら選択します。

← HTMLタグリファレンス/Tipsに戻る

eWeb