Javascript'te yapılan bir çok şeyde olay kullanılır.Kullanıcının sayfa üzerinde yaptığı her türlü işlem olaydır.Sayfayı açmak, bir nesnenin üzerine tıklamak, fareyle bir nesnenin üzerine gelmek, bir tuşa basmak, bir değeri değiştirmek.Bunların hepsi bir olaydır.Şimdi javascript'te sıklıkla kullanılan olaylardan bahsedelim. onClick olayı : Bu derse kadar onclick (tıklanıldığında) olayını düğme üzerinde birçok uygulamamızda kullandık.Bu olayı uygulamak için mutlaka düğme kullanılacak diye bir şart yoktur, herhangi bir html nesnesi de olabilir.onClick olayı; button, reset, submit, radio, checkbox ve area ile kullanılabilir. onDblClick olayı : onclick olayına çok benzeyen diğer olay: ondblclick (çift tıklanıldığında)tir.Adından da anlaşılacağı gibi kullanıcının fareyle çift tıklamasını ifade eder.Oldukça alışılmış bir olaydır.onDblClick olayının yarattığı etkiyi görmek için yukarıdaki örnekte onClick yerine onDblClick yazın.
Javascript’in, htm i tamamladığı noktaların başında form ve form yoluyla elde edilecek bilgilerle ilgili işlemler gelir.Bu işlemlerin başında ise formdaki bilgilerin server a gönderilmeden önce, daha browserda iken doğrulanması ve hatalardan arındırılması vardır.Javascript, bunu ziyaretçinin formda, submit(gönder) olayına yol açan herhangi bir düğmenin tıklanması halinde yapar.Bunu şimdi yapacağımız örnekle daha iyi anlayacaksınız. <form method="get" onSubmit="return onay()"> olayı ile form, gönderilmeden önce bir fonksiyona gönderiliyor.return kelimesi ile fonksiyondan değer geleceği anlaşılıyor.onay() fonksiyonunu incelersek confirm komudu ile üzerinde tamam ve iptal düğmelerinin bulunduğu bir pencere açılıyor.Tamam düğmesine basıldığında form bilgisi gönderiliyor.Bunu adres çubuğuna bakara ta görebilirsiniz.Eğer iptal düğmesine basılırsa kullanıaln return deyimlerinden dolayı, forma geri dönülüyor.
Formlara koyulan reset(başa dön) düğmesi, bir formdaki bütün bilgilerin silinmesini sağlar. Browserın geri düğmesini tıklamak dahil, hiç bir eylem ziyaretçinin yanlışlıkla bastığı sil düğmesinin sildiğini geri getiremez.Fakat javascript ile böyle bir hata önlenebilir.Çünkü sil düğmesinin oluşturduğu "reset" olayını yönlendiren onReset, bize bu imkanı verir.Bunu bir örnekle ifade edelim.
onFocus ve onBlur olayları : Html sayfasında da browserın focusunu(dikkat odağını) üzerinde topladığı veya odağın çekildiği üç nesne olabilir.Bunlar: Text (Metin), Textarea (Metinalanı) ve Select (Seç) etiketleridir.Çünkü ziyaretçinin sadece bu etiketlerin oluşturduğu nesnelere klavyenin dikkatini çekme hakkı vardır.Bu nesnelerden biri tıklanınca browserın dikkati bu nesneye dönmüş, yani "focus" olayı olmuş demektir.Bu durumda, biz de bu olayı yönlendiren onFocus u kullanabiliriz. Aynı mantıkla, ziyaretçi browserın dikkatini bu nesneden başka bir yere çektiği zaman bu nesne focus’u kaybeder, blur(netlikten çıkma, flulaşma) olayı olur. Bunu da onBlur ile yönlendiririz. Şimdi bu olayların kullanıldığı bir örnek yapalım. Javascript, üstteki kutuya adınızı yazdıktan sonra başka bir yeri tıkladığınızda olan iş, "ad" isimli metin kutusunun "blur" olayına onBlur’un çağırdığı goster() fonksiyonu ile; alttaki kutuyu mesleğinizi yazmak üzere tıkladığınız anda "meslek" kutusunda olan "focus" olayına da uyar() fonksiyonu ile karşılık veriyor.
onMouseOver ve onMouseOut olayları : onMouseOver olayı, mouse imlecinin bir html nesnesi üzerine gelmesini ifade eder. Şimdi bu olayları güzel bir örnekle gösterelim.
Javascript açısından browserın bir html sayfasını görüntülemeyi bitirmesi sayfanın load (yükleme), başka bir sayfaya geçilmesi ise önceki sayfanın unload(yüklenmişlikten çıkması) sayılır ve bu iki olayı onLoad ve onUnLoad yönlendiricileri ile karşılayabiliriz.Browser açısından asıl sayfa, body bölümüdür.Head bölümündeki komutlar, sayfanın nasıl görüntüleneceğine ilişkin komutlar içerir.Bizde şimdi body etiketini kullnarak bir örnek yapalım. Javascript'te sıklıkla kullanılan olaylar bu kadardır.Sizde değişik örnekler yaparak olaylar konusunu daha iyi anlayabilirsiniz. |
||||||
<< Nesneler | Olaylar | Pencere(window) >>
|
||||||
Başa Dön | ||||||