Javascript - Switch-Case örnek uygulama - PcTekno.NET | PTN

Konumunuz: Anasayfa

Javascript - Switch-Case örnek uygulama

Perşembe, 12 Temmuz 2007

Sample Image Bu methodun kullanımı ile ilgili bir program yazalım. Yazacağımız program hangi rengi sevdiğimizi soracak ve sayfanın zemin rengini(bgcolor) bu renge çevirecek.

<html>
<head>
<META HTTP-EQUIV="Content-Type" CONTENT="text/html;
charset=iso-8859-9">
<script language="JavaScript">
<!-- hide
var yas;
function kontrolEt()
  {
  document.giris.sonuc.value="";
  renk=document.giris.secilenRenk.value;
  switch (renk)
     {
     case "kırmızı" : document.bgColor="FF0000";
     break;
     case "mavi" : document.bgColor="0000FF";
     break;
     case "sarı" : document.bgColor="E9E900";
     break;
     case "yeşil" : document.bgColor="008080";
     break;
     case "gri" : document.bgColor="A0A0A0";
     break;
     case "pembe" : document.bgColor="FF00FF";
     break;
     case "siyah" : document.bgColor="000000";
     break;
     case "kayverengi" : document.bgColor="FFFFA0";
     break;
     case "gümüş" : document.bgColor="F0F0FA";
     break;
     default : 
       {
       document.bgColor="white";
       document.giris.sonuc.value="tanımsız renk";
       }
     }
  }
// -->
</script>
</head>
<body>
<table border=1 bgcolor=f0f0fa><tr><td>
<form name="giris">
<br>
Hangi rengi saversiniz?
<br><font size=1>mavi, kırmızı, sarı, gümüş, pembe,
<br>yeşil, kayverengi, siyah, gri.</font>
<br>
<input type="text" name="secilenRenk" size=7>
<input type="button" name="karsılastırma" value="  Tamam "
onClick="kontrolEt()">
<br>
<br><input type="text" name="sonuc" size="20">
</form>
</td></tr></table>
</body>
</html>

Burada bir form yardımı ile kullanıcıdan bir renk adı istiyoruz. Girişi yapılan renk değerininden sonra onClick(kontrolEt()) şeklinde bir kullanım ile kontrolEt() fonksiyonunu harekete geçiriyoruz.

onClick() bir butona basıldığında bir fonksiyonu harekete geçiren bir metoddur. İleride event konusunda derinlemesine bu konuyu inceleyeceğiz.

kontrolEt() fonksiyonunda ilk önce renk=document.giris.secilenRenk.value; kullanımı ile forma girilen değeri renk değişkenine aktarıyoruz. giris isimli formun secilenRenk adlı bölümünün value(sonucu) renk değerine yazılır. Bu konu form işleme konusunda incelenecektir.

switch case yöntemi ile renk kontrolü yapıyoruz. Her case kontrolünde bir rengi kontrol ediyoruz. Bu renk yazılan renge eşit ise yani renk değişkenine eşit ise yanındaki program bloğu çalışacaktır. Sonra break; komutu ile switch bloğundan çıkılır.

renk değişkeni ile kontrol ettiğimiz renk biribirlerine eşit değil iseler bir alt case kontrolüne geçilir. Girilen renk hiç bir case kontrolüne uymazsa default bloğu çalışır ve ekrana-giris formunun sonuc bölümüne- "tanımsız renk" değerini girer. Sonra zemin rengini beyaz yapar.

Her butona basıldığında kontrolEt() fonksiyonu çağrılacağından devamlı yeni renkler kullanılabilir.

Yorumlar (0) Add Comment