jQuery on () не работает stopPropagation?

Question

Я не могу заставить это прекратить размножаться ..

  $(document).ready(function(){
      $("body").on("click","img.theater",function(event){ 
          event.stopPropagation();    
          $('.theater-wrapper').show();
      }); 

       // This shouldn't fire if I click inside of the div that's inside of the 
       // `.theater-wrapper`, which is called `.theater-container`, anything else it should.
       $(".theater-wrapper").click(function(event){
           $('.theater-wrapper').hide();
       }); 
  });

См. Это jsfiddle

Answer 1

Поскольку вы используете on для элемента body, а не для img.theater, событие будет пузыриться до элемента body, и именно так оно и будет работать.

Вход события: .theater-wrapper elements click событие будет запущено, поэтому вы его видите.

Если вы не создаете никаких динамических элементов, то прикрепите обработчик события click непосредственно к элементу img.theater.

$("img.theater").click(function(event){
    event.stopPropagation();    
    $('.theater-wrapper').show();
}); 

В качестве альтернативы вы можете проверить цель события click внутри обработчика .theater-wrapper elements click и ничего не делать.

$(".theater-wrapper").click(function(event){
    if ($(event.target).is('img.theater')){
         event.stopPropagation();
         return;
    }
    $('.theater-wrapper').hide();
}); 

Answer 2

Лучший способ сделать это:

$(".theater-wrapper").click(function(event){
    if (!$(event.target).is('img.theater')){
        $('.theater-wrapper').hide();
    }
}); 

у меня работает с гармошкой и флажком

Answer 3

use event.stopImmediatePropagation () У меня это сработало

Answer 4

В ответ на ваш jsfiddle @ Dylan

Здесь: когда вы нажимаете белое пятно, оно не должно закрываться. jsfiddle.net / Cs8Kq - Дилан

Измените

if ($(event.target).is('img.theater')){

на

if ($(event.target).is('.theater-container')){

, и это будет работать.

Я решил это, используя console.log (event.target) в обработчике событий и просто используя селектор, который вышел из системы, когда я щелкнул белую область, о которой вы говорите.

Я бы 'Вместо этого я прокомментировал, но мне не хватает ТАКОЙ звездной пыли и монет.

РЕДАКТИРОВАТЬ: Вот так jsfiddle.net / heNP4 /