01202017Cu
Last updateÇrş, 09 Kas 2016 12pm


JAVA SCRIPT DERSLERİ

Javascript cancelBubble

Javascript event.cancelBubble özelliği, olay akışı sırasında Olay'ın kök elemente dönüp-dönmediğinin öğrenilmesini veya ayarlanmasını sağlar.

Bu özellik yerine stopPropagation() metodu önerilmektedir.
Sözdizimi

vazgec = event.cancelBubble

event.cancelBubble = dursun

dursun true, olay dönüşünün durdurulacağını, false, ise devam ettiğini belirtir.
Dönüş Değeri
vazgec true/false değer alarak, olay akışında olay dönüşünün iptal edilip-edilmediğini ifade eder. Varsayılan değeri false.

cancelBubble özelliği daima false değerini döndürür. Çünkü, olay akışı sırasında varsayılan değeri budur. Bir Olay dinleyici fonksiyonunda, true değeri atanarak, olay akışının kesilmesi durumunda ise ilgili olay için kendinden sonra gelen hiçbir olay dinleyicisinin çalıştırılması söz konusu olamayacağı için bu özelliğin değerinin true/false ile karşılaştırılması da söz konusu olamaz. Bunun yanında sadece, true atanarak olay akışının kesildiği Olay dinleyici fonksiyonunun içinde true döndürebilir.

Aşağıdaki örnek, bir tablo içindeki DIV elementine CTRL tuşu ile tıklandığında, tıklamanın iptalini göstermektedir.

<table id="ornekTablo"><tr><td>
<div id="ornekDiv" style="width:150px; height:100px;
background-color:#44BB55; text-align:center;">
<b>Tıkla bana!</b>
</div>
</td></tr></table>

<script type="text/javascript">

var ornekDiv = document.getElementById('ornekDiv');
var ornekTablo = document.getElementById('ornekTablo');

function bubblingKont(olay)
{
olay = olay || event;
if(olay.ctrlKey)
olay.cancelBubble = true;
}

function tiklandi()
{
olay = olay || event;
if(olay.cancelBubble == true)
{
alert("Olay Akışı Durdurulmuş!"); // Hiçbir zaman çalışmaz.
}
else
{
alert("Tabloya Tıklandı!");
}
}

ornekDiv.onclick = bubblingKont;
ornekTablo.onclick = tiklandi;
</script>

Yorum ekle


Güvenlik kodu
Yenile

FACEBOOK'TA TAKİP EDİN