HTML <SELECT> etiketi, biri liste kutusu (listbox) diğeri aşağı açılır liste (drop-down list) tipinde olmak üzere iki farklı tipte seçim kutusu (select box) oluşturulmasını sağlar. Bu iki tip arasındaki tek fark size özelliği ile belirtilen seçim kutusu içinde gösterilecek seçenek miktarıdır. Liste elemanları optgroup ve option etiketleri ile tanımlanır.
HTML Sözdizimi ve Özellikler
| <SELECT |
|---|
| id= | Eşsiz kimliğini belirtir. |
| class= | Sınıf adını belirtir. |
| style= | CSS kuralları tanımlar. |
| title= | Kısa bilgi belirtir. |
| lang= | İçerdiği metnin lisanını belirtir. |
| dir= | İçerdiği metnin yönünü belirtir. |
| name= | Kontrol ismini belirtir. |
| size= | Gösterilecek satır sayısını belirtir. |
| multiple= | Birden fazla seçim yapılabileceğini belirtir. |
| disabled= | Girişe kapalı (pasif) olduğunu belirtir. |
| tabindex= | Sekme (tab) sırasını belirtir. |
| > |
|---|
| secimler | optgroup ve option etiketleri ile seçenekleri belirler. |
| </SELECT> |
|---|
HTML & JavaScript Olayları
| <SELECT |
|---|
| onclick= | Elemente klavye veya fare ile tıklandığında tetiklenir. |
| ondblclick= | Elemente fare ile çift tıklandığında tetiklenir. |
| onmousedown= | Element üzerinde fare tuşuna basıldığında tetiklenir. |
| onmouseup= | Basılı olan fare tuşu bırakıldığında tetiklenir. |
| onmouseover= | Elementin kapladığı alana girildiğinde tetiklenir. |
| onmousemove= | Element üzerinde fare işaretçisi hareket ettirildiğinde tetiklenir. |
| onmouseout= | Elementin kapladığı alandan çıkıldığında tetiklenir. |
| onkeypress= | Element üzerindeyken klavyeden bir tuşa basıldığında tetiklenir. |
| onkeydown= | Element üzerindeyken klavyeden bir tuşa ilk basıldığında tetiklenir. |
| onkeyup= | Basılı olan klavye tuşu bırakıldığında tetiklenir. |
| onfocus= | Elemente odaklanıldığında tetiklenir. |
| onblur= | Element odaklanmasını yitirdiğinde tetiklenir. |
| onchange= | Giriş kontrolü içeriği değiştiğinde tetiklenir. |
| ></SELECT> |
|---|
Örnek
Aşağıdaki örnek, HTML SELECT etiketi kullanılarak aşağı açılır liste (drop-down list) oluşturulmasını göstermektedir.
<select>
<option>Seçim-1</option>
<option>Seçim-2</option>
<option>Seçim-3</option>
</select>
Test Edin
Aşağıdaki örnek, HTML SELECT etiketi kullanılarak liste kutusu (listbox) oluşturulmasını göstermektedir.
<select size="3">
<option>Seçim-1</option>
<option>Seçim-2</option>
<option>Seçim-3</option>
<option>Seçim-4</option>
<option>Seçim-5</option>
</select>
Test Edin
Aşağıdaki örnek, HTML SELECT etiketi ile CTRL tuşu kullanılarak birden fazla seçim yapılabilen liste kutusu (listbox) oluşturulmasını göstermektedir.
<select size="4" multiple="multiple">
<option>Seçim-1</option>
<option>Seçim-2</option>
<option>Seçim-3</option>
<option>Seçim-4</option>
<option>Seçim-5</option>
</select>
Test Edin