<select> 選択タグ
<select>タグは<input>タグのチェックボックスやラジオボタンと異なる選択メニューで、オプションメニューやスクロールリスト機能が使えます。selectタグは開始タグと終了タグを持ち、その中へ選択肢を指定する<option>タグを置きます。この<select>タグには2種類の表示方法があり、1つはポップアップメニュー方式で、これがデフォルト(初期設定)です。もう1つはsize属性を使ったメニューウィンドウ形式で表示される方式で、multiple属性を加えることによって<select>タグの選択肢が複数選べます。
<select>タグの属性をまとめると次のとおりです。<select name="menu"> <option> 第1選択肢 <option> 第2選択肢 : : </select>
nameはselect要素のシンボリック名です。 sizeを指定すると、その数だけメニュー項目形式で表示され、その数以上の選択肢があればスクロールリストになります。 multipleはメニューの中で選択肢を複数選ばせたい項目に対して使用します。コントロールキーを押しながら複数の選択ができます。 そして、<option>タグの属性は次のとおりです。
selectedは、あらかじめ選択された状態にしておきたい項目で使います。複数の選択を行う場合、<select>タグへmultipleを指定しておく必要があります。 valueは選択された時の値を指定し、指定しなければ<option>タグで記述した項目がその値となります。 以下はこれらを応用した記述例です。
<form method="post" action="/cgi-bin/post-query"> 今日は何をしたいですか? <select name="WhatToDo"> <option> 映画鑑賞 <option selected> 読書 <option> スキー <option> ビリヤード <option> 射撃 </select><p> 実行ボタン: <input type="submit" value=" 実 行 "><p> リセットボタン: <input type="reset" value="リセット"> </form>
<form method="post" action="/cgi-bin/post-query"> あなたはどこへ旅行したいですか? <select name="WhereToTravel" size=8> <option value="n_america"> 北アメリカ <option value="s_america"> 南アメリカ <option value="s_pacific"> 南太平洋 <option value="africa"> アフリカ <option value="europe" selected> ヨーロッパ <option value="e-europe"> 東欧 <option value="middle_e"> 中近東 <option value="russia"> ロシア <option value="china"> 中国 <option value="se_asia"> 東南アジア <option value="australia"> オーストラリア <option value="south_p"> 南極 </select><p> 旅行先でどこへ行きたいですか? (アイテムを選択する場合や解除する場合は、<br> コントロールキーを押して下さい<p> <blockquote> <select name="WhatToDo" multiple size=6> <option> 名所 <option selected> 史跡 <option selected> 美術館 <option> 博物館 <option> 遊園地 <option> 公園 <option selected> 海岸 <option> 山 <option> 平原 </select><p> </blockquote> 実行ボタン: <input type="submit" value=" 実 行 "> リセットボタン: <input type="reset" value="リセット"> </form>