myNotlar Logo

<INPUT type=radio>


HTML <INPUT type=radio> etiketi, birbirleri ile ilişkili fakat sadece birinin seçilebileceği radyo düğmesi (radio button / option button) oluşturulmasını sağlar.

Kullanıcıyı tek bir seçim ile sınırlandırmak için <INPUT type=radio> etiketi ile oluşturulacak birbirleri ile alakalı bütün radyo düğmelerinin name özelliklerinin aynı olması gerekir.

HTML Sözdizimi ve Özellikler

<INPUT type=radio
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ün ismini belirtir.
disabled=Girişe kapalı (pasif) olduğunu belirtir.
checked=Kontrolün seçili olduğunu belirtir.
readonly=Kontrolün sadece okunabilir olduğunu belirtir.
tabindex=Sekme (tab) sırasını belirtir.
accesskey=Klavye ile erişim sağlanacak harfi belirtir.
value=İlk değerini belirtir. (Sayfada gösterilmez.)
/>

HTML & JavaScript Olayları

<INPUT type=radio
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.
/>

Örnek

Aşağıdaki örnek, HTML INPUT type=radio etiketi kullanılarak 3 farklı yemek menüsünden seçilen menünün bir JavaScript fonksiyonu ile kontrol edilmesini göstermektedir.

<script type="text/javascript">
function yemekKontrol() {
    var yemekler = document.getElementsByName("yemekler");
    
    if(yemekler[0].checked)
        alert("Seçiminiz : Kuru Fasulye + Pilav + Cacık");
		
    else if(yemekler[1].checked)
        alert("Seçiminiz : Tas Kebabı + Pilav + Hoşaf");
		
    else if(yemekler[2].checked)
        alert("Seçiminiz : İzmir Köfte + Salata + Tatlı");
    else
        alert("Acıkmadınız mı?");    
}
</script>

<p>Lütfen menüyü seçiniz :</p>

<input type="radio" id="yemek1" name="yemekler" value="1" />
<label for="yemek1">Kuru Fasulye + Pilav + Cacık</label>
<br />
<input type="radio" id="yemek2" name="yemekler" value="2" />
<label for="yemek2">Tas Kebabı + Pilav + Hoşaf</label>
<br />
<input type="radio" id="yemek3" name="yemekler" value="3" />
<label for="yemek3">İzmir Köfte + Salata + Tatlı</label>
<br />
<button type="button" onclick="yemekKontrol()">Menü Seç</button>
Test Edin

Lütfen menüyü seçiniz :




İlgili Başlıklar
 
myNotlar Hakkında
Telif Hakkı © 2007-2009 mynotlar.com Tüm Hakları Saklıdır. Kopyalanamaz. Yayınlanamaz.
E-Posta : support@myNotlar.com

| Tek Kişilik Oyunlar | Sudoku | Oyunlar |