JavaScript Olaylar

HTML belgeleri birçok nesne içerir. Bu nesneler bazı etkilere maruz kalır. Örneğin bir buton tıklanmak içindir ve nesne için tıklanmış olmak bir olaydır.

JavaScript, bu olaylara tepki verebilir. Bu da kullanıcı ile tarayıcı arasında birçok işlem yapabilmemizi sağlar.

HTML Olaylarına Örnekler

Bazı olaylar tarayıcı tarafından olurken bazıları kullanıcı etkinliği sonucu meydana gelir.

Örneğin web sayfasının yüklenmiş olması bir olaydır ve tarayıcı tarafından JavaScript'e bildirilir.

Bir formdaki butona tıklanması ise kullanıcının meydana getirdiği bir değişimdir.

İşte bu tarz olaylar için JavaScript'te kodlar yazılabilir. Örneğin web sayfası yüklendikten sonra neler yapılacağı kodlara dökülebilir.

HTML Nesne Olaylarına JavaScript Kodu Eklemek

Bunun için HTML elementlerinde bazı özelliklere yer veririz.

HTML Kodu

   <button>Buraya Tıklayın</button>

HTML Görünümü

Yukarıdaki butonun tıklanması bir olaydır. Ancak JavaScript ile bağlanmadığı için bir tepki vermemektedir.

Şimdi butona tıklandığında bize "Merhaba!" demesini JavaScript yoluyla sağlayalım. Bunun için aşağıdaki kodu inceleyin.

HTML Kodu

   <button onclick="alert('Merhaba')">Buraya Tıklayın</button>

HTML Görünümü

Burada onclick="" ya da onclick='' şeklinde kullanabildiğimiz HTML özelliği sayesinde butona tıklandığında JavaScript'te yazdığımız kodların çalışmasını sağladık.

Önemli HTML Olayları

Olay Gerçekleşme Zamanı
onclick HTML nesnesine tıklanırsa
onchange HTML nesnesi değişirse
onmouseover Fare imleci, nesne üzerine gelirse
onmouseout Fare imleci, nesne üzerinden çekilirse
onkeydown Klavyeden bir tuşa basılırsa
onload Tarayıcı sayfayı yüklemeyi bitirirse