Как проверить «дочерность» кликнутого элемента?

Question

[hujak_hujak]

$('body').click(function (e)
 //Слушаю клик на всей странице {
  if((parseInt(mNav.css('left')) === 0)){ 
//Проверяю видно ли меню (если 0, то оно видно. mNav - это обертка менюшки)
      if ((e.target !== $('.mobile-nav')[0]) && (e.target !== $('.mobile-nav')[0].children('.mobile-nav')))
{ // Сначала проверяю: кликнутый элемент - это не меню? Затем проверяю: кликнутый элемент - это не дочерние элементы меню?
          hideNav(); //Если клик не по меню или по его дочерним элементам, то скрываю меню
      }
  }
});

Добрый день, помогите пожалуйста решить проблему.
В примере выше я хочу реализовать свертывание меню. При клике на любой элемент, меню должно свернуться, при клике на меню или его дочерние элементы, меню должно остаться на месте.

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

Подскажите, как это правильно реализовать

Answer 1

[tyzberd]

для проверки на видимость есть https://api.jquery.com/visible-selector/
еще есть closest и parents для проверки или это не пункты меню.
https://ru.stackoverflow.com/questions/140922/%D0%...

Answer 2

[Владимир Мальков]

создай overlay, повесь на него ивентхендлер, меню сделай "выше", используя z-index.

Answer 3

[KazeZlat]

Ход мыслей у вас правильный, но вот условие сокрытия вы написали не так. Например, вы пытаетесь вызвать .children(selector) у DOM-объекта, а не jQuery-объекта.

У вас уже используется jQuery, так почему бы не использовать его методы?

// Если меню не является e.target и e.target не находится внутри меню
if (!$('.mobile-nav').is(e.target) && !$('.mobile-nav').find(e.target).length) {
    hideNav();
}