Jquery derslerimize devam ediyoruz.Bu derste event yani olayları sonlandıran stopPropagation() komutunu anlatacağım.Bazen vent verdiğimiz alt objelerde bu eventın çalışması sıkıntı yaratabilir.Bu yüzden alt objeleri seçip event çalışmasın diyebilir stopPropagation sayesinde.
$("seçici").click(function(event){
event.stopPropagation();
})
Kullanımı bu şekilde.Fonksiyondaki event parametresi tüm eventlarda mevcuttur.Bu eventı seçip stopPropagation() uyguladığımızda event durur.
Eventın şuan aktif olup olmadığınıda isPropagationStopped() ile kontrol edebilirz.
if(event.isPropagationStopped()){
//aktif
}else{
//aktif değil
}
Bu komutun ne kadar gerekli bilmiyorum ama yazmak istedim.
Genel örnek :
<!DOCTYPE HTML>
<html lang="en-US">
<head>
<meta charset="UTF-8">
<title>UstaDerslik</title>
<script type="text/javascript" src="http://code.jquery.com/jquery-1.11.1.min.js"></script>
<script type="text/javascript">
$(function(){
$(".ana").click(function(){
alert("tıklandı.");
})
$(".ana *").click(function(e){
e.stopPropagation();
})
})
</script>
</head>
<body>
<div class="ana">
Ana
<div>alt eleman 1</div>
<div>alt eleman 2</div>
<div>alt eleman 3</div>
</div>
</body>
</html>
Yukarıda "Ana" yazısı dışında diğerlerine tıklandığında uyarı vermeyecektir.stopPropagation() kaldırırsanız hepsine tıklandığında uyarı verecektir.