Ana içerik

Bilgisayar Programlama

Konu: Bilgisayar Programlama > Ünite 6

Ders 5: DOM Olayları

Özet: DOM olayları

Olay dinleyicileri ekleme

Bir öğeye bir olay olduğunda, tarayıcının belirli bir fonksiyonu çağırdığından emin olmak için, document.addEventListener kullanmalısınız:

var buttonEl = document.getElementById("clicker");
var onButtonClick = function() {
    console.log("Oh golly gosh, you clicked me");
};
buttonEl.addEventListener("click", onButtonClick);

Birinci argüman olarak birçok geçerli dize geçirebilirsiniz, olay türleri makalesine bakın.

Meydana gelen olayla ilgili bilgi isterseniz, tarayıcının geriçağırım fonksiyonunuza geçirdiği olay nesnesine bakabilirsiniz:

var faceEl = document.getElementById("face");
var onFaceClick = function(e) {
console.log("You clicked " + e.clientX + " , " + e.clientY);
};
faceEl.addEventListener("click", onFaceClick);

Olay nesnesinde pek çok özellik vardır, tüm listeyi buradan görebilirsiniz.

Bir bağlantıdaki tıklama veya bir formdaki teslim etme davranışını geçersiz kılıyorsanız, tarayıcının ön tanımlı davranışını engellemek için, event.preventDefault()'u çağırmak isteyebilirsiniz.

Olay dinleyicilerini kaldırmak

Belirli bir olay dinleyicisine artık ihtiyacınız yoksa, onu removeEventListener kullanarak kaldırabilirsiniz:

var faceEl = document.getElementById("face");
var onFaceClick = function(e) {
    console.log("You clicked " + e.clientX + " , " + e.clientY);
};
faceEl.addEventListener("click", onFaceClick);
// later...
faceEl.removeEventListener("click", onFaceClick);

Tartışmaya katılmak ister misiniz?

Giriş Yap

Sıralama ölçütü:

Henüz gönderi yok.

İngilizce biliyor musunuz? Khan Academy'nin İngilizce sitesinde neler olduğunu görmek için buraya tıklayın.