Bagaimana untuk menyediakan kotak senarai drop-down html

Kotak senarai lungsur turun HTML ialah salah satu elemen interaktif yang biasa digunakan dalam halaman web, yang membolehkan pengguna memilih satu atau lebih pilihan yang dipratentukan. Dalam artikel ini, kami akan memperkenalkan cara untuk menyediakan kotak senarai juntai bawah HTML, termasuk membuat kotak senarai juntai bawah, menambah pilihan, menetapkan pilihan lalai, dsb.

1. Buat kotak senarai juntai bawah

Langkah pertama dalam menggunakan kotak senarai juntai bawah HTML ialah membuat teg

<select name="fruit">
</select>

Kod ini mencipta Kotak senarai juntai bawah bernama "buah" muncul, tetapi tiada pilihan di dalamnya lagi.

2. Tambah pilihan

Seterusnya, kami perlu menambah pilihan dalam teg 🎜 >

<select name="fruit">
  <option value="apple">苹果</option>
  <option value="banana">香蕉</option>
  <option value="orange">橙子</option>
</select>

Setiap teg mengandungi dua bahagian: teks paparan dan nilai. Teks paparan merujuk kepada teks yang dipaparkan dalam kotak senarai juntai bawah, dan nilai merujuk kepada nilai yang dihantar kepada pelayan selepas pilihan dipilih.

3. Tetapkan pilihan lalai

Secara lalai, pilihan pertama dalam kotak senarai juntai bawah akan dipilih. Jika anda ingin menetapkan pilihan lain sebagai pilihan lalai, anda boleh menggunakan atribut yang dipilih dalam teg pilihan lalai.

4. Sediakan berbilang pilihan

Jika anda mahu pengguna memilih berbilang pilihan, anda boleh menggunakan berbilang atribut dalam teg

Pelbagai pilihan boleh dipilih apabila pengguna menahan kekunci "Ctrl" dan mengklik pada pilihan. Pelayan boleh menerima nilai untuk berbilang pilihan.

5. Sediakan penyerahan borang

Selepas pengguna memilih satu atau lebih pilihan, nilai pilihan ini perlu diserahkan kepada pelayan. Untuk melakukan ini, anda perlu menggunakan atribut nama dalam teg untuk mengaitkan kotak senarai juntai bawah dengan elemen lain dalam borang, seperti yang ditunjukkan di bawah:

<select name="fruit">
  <option value="apple">苹果</option>
  <option value="banana" selected>香蕉</option>
  <option value="orange">橙子</option>
</select>

Dalam contoh ini, yang lain elemen dalam bentuk tidak dipaparkan, tetapi ia boleh ditambah pada borang dengan cara yang sama untuk kefungsian yang lebih kompleks.

Secara umum, kotak senarai juntai bawah HTML ialah salah satu elemen interaktif yang biasa digunakan dalam halaman web Selepas memahami cara membuat, menambah pilihan, menetapkan pilihan lalai, menetapkan berbilang pilih dan menetapkan penyerahan borang, anda boleh Sesuaikan kotak senarai juntai bawah mengikut keperluan anda supaya pengguna boleh membuat pilihan dengan mudah.

Atas ialah kandungan terperinci Bagaimana untuk menyediakan kotak senarai drop-down html. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!