jQuery에서 요소 바깥 쪽을 클릭하면 함수가 실행됩니다.

Question

#search-container form 요소를 제외하고 본문을 클릭하면 루프의 다른 요소를 표시하려고합니다. 작동하지만, 먼저 요소 #search-container form을 클릭하고 한 번만 작동하면됩니다.

$('html').click(function(event) { 
    $('#search-container form').click(function(event){ 
     event.stopPropagation(); 
    }); 
    $('html').on('click',function() { 
     $('#small-search a').toggleClass('notvisible'); 
     $('#session').toggleClass('notvisible'); 
     $('#search-container').css('position','absolute'); 
     $('#search-container form').toggleClass('visible'); 
    }); 
}); 

Answer 1

$('html').not("#search-container form").on('click',function(){ 
    $('#small-search a').toggleClass('notvisible'); 
    $('#session').toggleClass('notvisible'); 
    $('#search-container').css('position','absolute'); 
    $('#search-container form').toggleClass('visible'); 
}); 

Answer 2

사용 .not() 당신이 클릭 이벤트를 바인딩 jQuery 오브젝트에서 요소 제거 :

$('html').not("#search-container form").on('click',function(){ 
    $('#small-search a').toggleClass('notvisible'); 
    $('#session').toggleClass('notvisible'); 
    $('#search-container').css('position','absolute'); 
    $('#search-container form').toggleClass('visible'); 
}); 

소스 (들)

jQuery API - .not()