JavaScript Olayları
HTML olayları, HTML öğelerinin başına gelen "şeylerdir" .
HTML sayfalarında JavaScript kullanıldığında, JavaScript bu olaylara "tepki verebilir" .
HTML Olayları
Bir HTML olayı, tarayıcının yaptığı veya kullanıcının yaptığı bir şey olabilir.
İşte bazı HTML olay örnekleri:
- Bir HTML web sayfasının yüklenmesi tamamlandı
- Bir HTML giriş alanı değiştirildi
- Bir HTML düğmesi tıklandı
Çoğu zaman, olaylar olduğunda, bir şeyler yapmak isteyebilirsiniz.
JavaScript, olaylar algılandığında kodu çalıştırmanıza izin verir.
HTML, JavaScript koduyla olay işleyici özelliklerinin HTML öğelerine eklenmesine izin verir.
Tek tırnak ile:
<element
event='some JavaScript'>
Çift tırnak ile:
<element
event="some JavaScript">
Aşağıdaki örnekte, bir öğeye bir onclicknitelik (kodlu) eklenir
:<button>
Örnek
<button onclick="document.getElementById('demo').innerHTML = Date()">The time is?</button>
Yukarıdaki örnekte, JavaScript kodu, öğenin içeriğini id="demo" ile değiştirir.
Sonraki örnekte, kod kendi öğesinin içeriğini değiştirir ( kullanarak this.innerHTML):
Örnek
<button onclick="this.innerHTML = Date()">The time is?</button>
JavaScript kodu genellikle birkaç satır uzunluğundadır. İşlevleri çağıran olay özniteliklerini görmek daha yaygındır:
Örnek
<button onclick="displayDate()">The time is?</button>
Ortak HTML Olayları
İşte bazı yaygın HTML olaylarının bir listesi:
| Etkinlik | Açıklama |
|---|---|
| onchange | Bir HTML öğesi değiştirildi |
| tıklamada | Kullanıcı bir HTML öğesini tıklatır |
| fare üzerinde | Kullanıcı, fareyi bir HTML öğesinin üzerine getirir |
| onmouseout | Kullanıcı, fareyi bir HTML öğesinden uzaklaştırır |
| onkeydown | Kullanıcı bir klavye tuşuna basar |
| aşırı yük | Tarayıcı sayfayı yüklemeyi tamamladı |
Liste çok daha uzundur: W3Schools JavaScript Referansı HTML DOM Olayları .
JavaScript Olay İşleyicileri
Olay işleyiciler, kullanıcı girdisini, kullanıcı eylemlerini ve tarayıcı eylemlerini işlemek ve doğrulamak için kullanılabilir:
- Her sayfa yüklendiğinde yapılması gerekenler
- Sayfa kapandığında yapılması gerekenler
- Kullanıcı bir düğmeye tıkladığında gerçekleştirilmesi gereken eylem
- Kullanıcı veri girdiğinde doğrulanması gereken içerik
- Ve dahası ...
JavaScript'in olaylarla çalışmasına izin vermek için birçok farklı yöntem kullanılabilir:
- HTML olay özellikleri, JavaScript kodunu doğrudan çalıştırabilir
- HTML olay öznitelikleri JavaScript işlevlerini çağırabilir
- HTML öğelerine kendi olay işleyici işlevlerinizi atayabilirsiniz.
- Olayların gönderilmesini veya işlenmesini engelleyebilirsiniz
- Ve dahası ...
HTML DOM bölümlerinde olaylar ve olay işleyiciler hakkında çok daha fazlasını öğreneceksiniz.