Как добавить прослушиватель событий, используя jQuery?

Question

Иметь этот код и пытался скрыть мою сторону navbar при нажатии за пределами #nav, получил эту ошибку.

Невозможно прочитать свойство addEventListener со значением NULL

$( document ).ready( function() {
    setTimeout(function(){
        $('.menu-opener').click(function(){
            $('#nav').toggleClass('active');
        });
        let slide = document.querySelector('#nav .active');
        slide.addEventListener('click', function(e) {
            if (e.target !== slide) return;
            $('#nav').removeClass('active'); 
        });
    }, 1000);
}); 

Answer 1

Попробуйте это внутри setTimeout

$('body').on('click','#nav .active', function(e){
   // your logic
})

ИЛИ

$( "'#nav .active'" ).bind( "click", function(e) {
// your logic
});

вместо

let slide = document.querySelector('#nav .active');
        slide.addEventListener('click', function(e) {
            if (e.target !== slide) return;
            $('#nav').removeClass('active'); 
        });

Answer 2

Получил эту работу с

$(document).click(function(event) { 
    if(!$(event.target).closest('#nav').length && !$(event.target).closest(".menu-opener").length)
    {
        $('#nav').removeClass('active');
    }        
});

Answer 3

ответ заключается в том, что вам нужно обнаружить щелчок за пределами div, который вы пытаетесь скрыть:

$(window).click(function() {
//Hide the menus if visible
});

//stopping above function from  running when clicking on #nav itself
$('#nav').click(function(event){
    event.stopPropagation();
});