HTML option tag | belajar <option> element

HTML Fadlullah Fadul December 3, 2018

Referensi Belajar HTML option tag. Tutorial dan panduan mengenai element <option>...</option> yang menunjukkan sebuah opsi atau daftar pilihan. Mencakup penjelasan yang disertai contoh kode penggunaan sebagai rujukan untuk materi belajar HTML elemen <option>.

Deskripsi
Penjelasan HTML option

HTML <option> element merepresentasikan sebuah opsi (pilihan dari daftar alternatif). Jadi, opsi ditulis lebih dari satu sebagai daftar untuk memilih pilihan yang diinginkan oleh user.

<option> element ditulis sebagai anak element dari <select>, <datalist> dan <optgroup>.

Attributes
Atribut HTML Tag <option>

disabled

Menentukkan bahwa element (opsi) nonaktif (tidak dapat diedit atau diseleksi).

Value: disabled

label

Menentukkan label untuk sebuah item daftar pilihan (opsi).

Value: teks

selected

Menentukkan item terpilih pertama kali ketika halaman web dimuat.

Value: selected

value

Menentukkan nilai (teks) yang akan dikirim pada sebuah server. Jika tidak disebutkan, maka value-nya akan diambil dari konten element option itu sendiri.

Value: teks

Global Attributes
Atribut Secara Global (Keseluruhan)

<option> tag mencakup global attributes, yang artinya tag tersebut dapat disisipkan semua attributes yang termasuk dalam global attributes yang secara umum berlaku untuk semua HTML tags.

Silahkan, lihat referensi mengenai HTML Global Attribute

Event Attributes
Atribut event (Peristiwa)

<option> tag mencakup event attributes, yang artinya attribute tersebut dijalankan ketika ada interaksi dari user atau dalam suatu peristiwa (kejadian). Contoh: menjalankan script (JavaScript) ketika halaman web pada jendela browser hendak ditutup, dan lain sebagainya.

Silahkan, lihat referensi mengenai HTML Events Attribute

Example
Contoh HTML <option> element

HTML 
<select>
  <option value="lele">Ikan Lele</option>
  <option value="mas">Ikan Mas</option>
  <option value="teri">Ikan Teri</option>
  <option value="tongkol">Ikan Tongkol</option>
</select>

Contoh Lengkap

Contoh source code lengkap disertai dengan link "editor" untuk mencoba (try it) dan melihat hasil (preview) kode.

SOURCE
editor 
<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8" />
    <title>Demo HTML option tag</title>
    <style>

    </style>
  </head>
  <body>
    <form action="voting_ikan.php" method="get">
      <p>Ikan apa yang menurut Anda paling enak dimakan?</p>
      <label>Ikan Favorit:
        <select>
          <option value="lele">Ikan Lele</option>
          <option value="mas">Ikan Mas</option>
          <option value="teri">Ikan Teri</option>
          <option value="tongkol">Ikan Tongkol</option>
        </select>
      </label>
    </form>
  </body>
</html>
SHARE
Previous Article Next Article