Javascript addeventlistener kullanımı

Javascript addeventlistener kullanımı bir nesne üzerindeki olayları dinlemektedir. Bu olaylar nesneye tıklama, üzerine gel, üzerinden gitme vb. gibi olaylardır.

Kullanımı : element.addEventListener("click",function(){})

addEventListener methodu kullanımı ile html elemanları içerisinde tek tek seçme işlemi sağlamadan sınıflar ile tüm elemanları seçebilir veya bir elemanı seçerek html elemanı üzerindeki durumları dinleyebilmekteyiz.

<a class="control" href="https://www.kodhocasi.com">Kod Hocası</a>
document.querySelector(".control").addEventListener("click",function(event){
	event.preventDefault();
	alert("Farklı bir siteye gidiyorsun");
});

Yukarıdaki örnek üzerinde bir a html elemanına tıklama durumunda belirtilen adrese gitmemesi için fonksiyon içerisinde öncelikle preventDefault methodu ile iptal etmekteyiz.

Daha sonra kullanıcıya uyarı pencere içerisinde Farklı bir siteye gidiyorsun diye uyarı vermekteyiz.

preventDefault methodu bir nesne üzerindeki olayların doğal akışını, özelliklerini engellemektedir.

addEventListener methodu ile html elemanları üzerinde mouseout, mouseover, mousemove, mousedown, load vb. gibi kullanımlarda sağlayabilmekteyiz.

Yorumlar

Yorum Yapabilmek İçin Giriş Yapmalısınız.
İlk Yorum Yapan Sen Ol!
Uçur Beni Kahramanım Yukarı Çık
Bu web sitesi çerezleri kullanıyor. Devam ederek çerez kullanımını kabul etmiş oluyorsunuz. Detay

Devam Etmek İçin Giriş Yapın

Kod Hocası İle Paylaşımda bulunabilir, Kendini geliştirebilirsin. Sende Hemen Giriş Yap Aramıza Katıl.

GirişKayıt Ol