как остановить функцию триггера контейнера

Question

если .hidden скрыт после нажатия кнопки lt (содержит все, что нажимает на название или значок или пробел), будет отображаться .hidden. то как сделать только щелчок .icon.hidden станет шкурой?

теперь она не работает, после нажмите .icon ничего не случится ... Я думаю, потому что .icon внутри .lt, когда нажмите .icon.lt активирует кнопку слишком, то после выполнения скрыть .lt функцию щелчка?

$('.lt').on({'click': function() { 
    if(!$('.$('.hidden').is(:visible)')){ 
     var src="b"; 
     $('.icon img').attr('src', src); 
     $('.hidden').show(); 
    } 
}); 
$('.icon').on({'click': function() { 
    if($('.$('.hidden').is(:visible)')){ 
     var src="a"; 
     $('.icon img').attr('src', src); 
     $('.hidden').hide(); 
    } 
}); 

<div class="lt"> 
    <div class="title"> 
    </div> 
    <div class="icon"> 
     <img src="a"> 
    </div> 
    <div class="hidden"> 
    </div> 
</div> 

.hidden{display:none;} 

Answer 1

Похоже, вам нужно остановить распространение события вложенного элемента:

$('.icon').on({'click': function(e) { 
    e.stopPropagation(); 
    //... 
}); 

Answer 2

.stopPropagation() является то, что вам нужно, но у вас есть проблемы с кодом в if состоянии:

$('.lt').on({'click': function() { 
    if(!$('.hidden').is(':visible')){ //<----change this way here 
     var src="b"; 
     $('.icon img').attr('src', src); 
     $('.hidden').show(); 
    } 
}); 

в приведенный выше сценарий вы можете проверить на скрытую прямую if($('.hidden').is(':hidden')){

---

Здесь ниже вы должны разместить .stopPropagation(), чтобы остановить событие, чтобы пузыриться до его родителя в дереве.

$('.icon').on({'click': function(e) { 
    e.stopPropagation();    //<----it stops the event bubbling 
    if($('.hidden').is(':visible')){ //<----this should also be changed to this 
     var src="a"; 
     $('.icon img').attr('src', src); 
     $('.hidden').hide(); 
    } 
});