Ziyaretçinin bir HTML sayfasında bir çok şık?tan birini seçmesini sağlayan radyo düğmesi (radio) isimli işaretleme yönteminde ise, aynı adı taşıyan bütün radyo düğmelerinden biri işaretlenince, Browser diğerlerini işaretlenmemiş hele getirir; dolayısıyla bu düğmenin değeri (.value özelliği) kullanılabilir. Aşağıdaki kodu yazar ve radyo.htm adıyla kaydederek, Browser?da açarsanız, seçtiğiniz radyo düğmesinin değerinin uyarı kutusunda kullanıldığını göreceksiniz.
<HTML>
<HEAD>
<TITLE>Radyo Dugmesi Örnegi</TITLE>
<META http-equiv="Content-Type" content="text/html; charset=windows-1254">
<SCRIPT LANGUAGE = "JavaScript1.2">
function radyoDegeri(radyoNesnesi) {
var deger = null
for (var i=0; i<radyoNesnesi.length; i++) {
if (radyoNesnesi[i].checked) {
deger = radyoNesnesi[i].value
break }
}
return deger
}
</SCRIPT>
</HEAD>
<BODY>
<FORM name="form1">
<p><input type=radio name="sanatci" value="Türkü">Neşet Ertaş</p>
<p><input type=radio name="sanatci" value="Şarkı">Zeki Müren</p>
<p><input type=radio name="sanatci" value="Pek anlamadım!">Sezen Aksu</p>
<input type=button value="Ne tür müzik seviyorum?" onClick="alert(radyoDegeri(this.form.sanatci))">
</FORM>
</BODY>
</HTML>
HTML kuralları gereği, bir grup oluşturan radyo düğmeleri aynı adı taşırlar. Burada “this” anahtar kelimesi ile içinde bulunduğumuz yani “bu formun,” “sanatcı” dizi-değişkeninin tümüyle fonksiyona gönderilmesini sağlıyoruz. “radyoDegeri” adlı fonksiyonumuz zaten böyle bir öbek bilgi bekliyor ve aldığı tüm radyo düğmesi nesnesine “radyoNesnesi” adını verip, önce büyüklüğüne bakıyor. Bir dizi-değişkenin büyüklüğü eleman sayısıdır; ki bu bizim örneğimizde üçtür. “i” sayacı 0, 1 ve 2 değerleri için sınanıyor ve bunlardan birinin işaretli olması bekleniyor. İşaretli radyo düğmesi bulunduğu anda değeri “deger” değişkenine yazılıyor ve döngü kesiliyor (break). Gerisi, uyarı kutusunun “değer” değişkeni ziyaretçiye göstermesinden ibaret.
Hakkı Öcal Javascript dersleri