Как не закрывать элемент по клику на дочерний элемент?

Question

[Даниил Сухих]

У меня есть элемент, при клике на который у меня появляется его скрытый дочерний элемент и мне нужно чтобы при клике на дочерний элемент он не исчезал. А при клике на родителя исчезал. Т.к. я использую fadeToggle.

<div> < ------ При клике появляется span, при повторном исчезает
       <span></span> <------------ При клике нечего не происходит
</div>

Answer 1

[0xD34F]

Добавьте дочернему элементу обработчик клика, где будет производится остановка всплытия события:

$('div > span').click(e => e.stopPropagation());

Или в обработчике клика родительского элемента проверяйте, откуда пришло событие, если от дочернего элемента - ничего делать не надо:

$('div').click(function(e) {
  if ($(e.target).is('span')) {
    return;
  }

  ...
});

Answer 2

[Andrew]

https://codepen.io/kickerock/pen/oNNKKZX

Answer 3

[Роман Ходаковский]

$('div').click(function (e) {
   var $span=$('span',$(this));
   $span.fadeToggle();
   $span.click(function (e) {
       e.stopPropagation();
       return false;
   })
})