49 of 133 menu

selectタグ

タグ select は、HTML フォームで使用するためのドロップダウンリストを作成します。

リストの個々の項目は、タグ option 内に記述する必要があります。

属性

属性 説明
multiple この属性を指定すると、マルチセレクト(複数選択可能なドロップダウンリスト)が作成されます。 Ctrl キーを押しながら、またはマウスで範囲選択することで複数の項目を選択できます。
任意の属性です。
name ドロップダウンリストの名前です。PHPで入力フィールドのデータを取得するために必要です。 フォームを正しく動作させるためには、入力フィールドの名前は(1つのフォーム内で)互いに重複してはいけません。 重複している場合、PHPにはHTMLコードで下位にある入力フィールドのデータが送信されます。

ドロップダウンリストの動作を見てみましょう:

<select> <option>City1</option> <option>City2</option> <option>City3</option> <option>City4</option> </select>

:

CSSプロパティ width で明示的に指定されていない場合、ドロップダウンリストの幅を最大の要素の幅に合わせてみましょう:

<select> <option>Big City1</option> <option>City2</option> <option>City3</option> <option>City4</option> </select>

:

. デフォルト選択

次に、デフォルトで都市を選択するようにしてみましょう。 属性 selected を使用して行います:

<select> <option>Big City1</option> <option selected>City2</option> <option>City3</option> <option>City4</option> </select>

:

. マルチセレクト

属性 multiple を使用して、通常のセレクトをマルチセレクトに変えてみましょう:

<select multiple name="city[]"> <option>City1</option> <option>City2</option> <option>City3</option> <option>City4</option> </select>

:

属性 name で指定されたセレクト名の末尾に角括弧が必要なことに注意してください。これはPHPで選択された全ての値が送信されるようにするためです(そうしないと、最後の1つの値のみが送信されます)。

. マルチセレクトでの複数のデフォルト値

マルチセレクトで、デフォルトとして複数の値を選択するようにしてみましょう:

<select multiple name="city[]"> <option>City1</option> <option selected>City2</option> <option>City3</option> <option selected>City4</option> </select>

:

関連項目

  • デフォルトで選択されるリスト項目を指定する属性 selected
  • リスト項目をグループ化するタグ optgroup
  • ドロップダウンリストを作成するタグ datalist
日本語
AfrikaansAzərbaycanБългарскиবাংলাБеларускаяČeštinaDanskDeutschΕλληνικάEnglishEspañolEestiSuomiFrançaisहिन्दीMagyarՀայերենIndonesiaItalianoქართულიҚазақ한국어КыргызчаLietuviųLatviešuМакедонскиMelayuမြန်မာNederlandsNorskPolskiPortuguêsRomânăРусскийසිංහලSlovenčinaSlovenščinaShqipСрпскиSrpskiSvenskaKiswahiliТоҷикӣไทยTürkmenTürkçeЎзбекOʻzbekTiếng Việt
当サイトでは、サイトの動作、分析、パーソナライゼーションのためにクッキーを使用しています。 データ処理はプライバシーポリシーに従って行われます。
すべて受け入れる 設定 拒否