.live() tarafından ele alındığında ebeveynlere yayılan çocuk tıklama etkinliklerini durdurmak mümkün mü?

Question

Resimlerin ve içeriğimin üzerine "Back Board" yazdım: http://syndex.me Temel olarak, bir resme tıkladığınızda, tıklanan içeriğin üzerinde bir bilgi paneli kaplayacaksınız.

bir etiket, linke tıklayın yapabilme halen açık bilgi panelini veya sosyal simgesini içinde zayıflatmak için sitenin arka plan üzerinde

• tıklayın:

  iki şey yapmak istiyoruz tetikleme yapılmadan bilgi paneli, üst fonksiyonun da tekrar sönmesidir. i tıklama etkinlikleri .live tarafından ele alınması gerekiyor gibi çocuk tıklama için stopPropagation kullanamazsınız

Bu mesaj dinamik yüklenirken olmasından kaynaklanmaktadır ana tıklayarak() (see documentation) yürürlükten kaldırılmaktadır.

Sadece gibi bir şey diyemeyiz. O mesajlarda sarmalayıcı kapsadığı ediliyor Çünkü {Bilgi Kurulu kaybolup //}) ((function tıklayın $ ("# Arka Plan") ve ben can' t bir olay ont şapka koymak çünkü o zaman bile çocuk olayları devralarak ebeveynlerin ikileminde daha derin değilim.

Şimdiye kadar sadece en az bir infoboard açık olabilir (yani bir resmin üzerine tıklayın)

$('.theContent:not(.clicked)').live("click", function() { 
      $(this).children('.postInfo').fadeIn(400); 
      $(".clicked").each(function() { 
        $(this).find('.postInfo').fadeOut(400); 
        $(this).removeClass('clicked'); 
      }); 
     $(this).addClass("clicked"); 
}); 
    $('.clicked').live("click", function() { 
      $(".clicked").each(function() { 
       $(this).find('.postInfo').fadeOut(400); 
       $(this).removeClass('clicked'); 
      }); 
}); 

) (.live, .del Re:., sonra başka, bu yüzden bu bölüm iyi hepsi zaten bir açıldı kapatın ve mevcut olanı açacak egate() ve .stopPropogation():

onlar belgenin üstüne derlendikten sonra .live() yöntemi olayları işleyen yana

, canlı olayların yayılmasını durdurmak mümkün değildir. Benzer şekilde, .delegate() tarafından işlenen olaylar, delege edildikleri öğelere yayılacaktır; DOM ağacındaki altındaki herhangi bir öğeye bağlı olay işleyicileri, temsilci olay işleyicisinin çağrıldığı andan itibaren zaten yürütülmüştür. Bu nedenle, bu işleyiciler, temsilci işleyicisinin event.stopPropagation() öğesini arayarak veya false değerini döndürerek tetiklemesini engelleyebilir.

Answer 1

Nasıl basitçe olay aslında spesifik bir öğesine işleminin yapılıp denetlenmesi hakkında: post dinamik yüklendiğinde

function activate(el) { 
    el.find('.postInfo').fadeIn(400); 
    el.addClass('clicked'); 
} 
function deactivate(el) { 
    el.find('.postInfo').fadeOut(400); 
    el.removeClass('clicked'); 
} 
$('.theContent:not(.clicked)').live('click', function(e) { 
    deactivate($('.clicked')); 
    activate($(this)); 
}); 

$('.clicked').live("click", function(e) { 
    if (! $(e.target).is('a')) { 
     // this should not trigger if a click occured on one of the links 
     deactivate($(this)); 
    } 
}); 

$('#ape').click(function(e) { 
    if ($(e.target).is('#ape')) { 
     deactivate($('.clicked')); 
    } 
}); 

Answer 2

yaklaşık binding click olayını düşündünüz mü? Bu şekilde stopPropagation() öğesini kullanabilirsiniz. Eğer ana öğeye olay bağlamak Eğer evladımız var için

http://jsfiddle.net/rkw79/CzEj5/

Answer 3

, onun yayılma olayı durmayacak.

Bir etkinliği her çocuğa bağlamak ve durma yayılma çağrısı üzerine THERE koymak ya da yalnızca ebeveynteki tıklatma olayını kimin kandıracağını test etmek için iki çözümünüz vardır. Ben prsonaly ikinci çözümü daha şık buluyorum.

Burada bu konuda daha fazla bir şey okuyabilir: http://redfishmemories.blogspot.it/2014/08/jquery-prevent-event-propagation-and.html