닫기 어디서나

Question

I가 거의 완벽하게 작동합니다 다음 스크립트 :

http://jsfiddle.net/oshirowanen/uUAqe/

난 그냥 일이 어떤 드롭 다운이 자동으로 위치를 페이지에 상관없이 닫힙니다 기능을 추가해야 할 필요 사용자가 클릭 , 텍스트 상자에, 버튼에, 페이지의 빈 부분에이를 수 등 등

Answer 1

여기에 업데이트 된 jsFiddle 페이지를 참조하십시오 : http://jsfiddle.net/KYqyU/

수행하는 설명하기 위해는, 첫째로, 당신은 클릭을 결합 ev 탐색 드롭 다운을 숨길 문서를 찾습니다.

$(document).click(function() { 
    $('.dropdown').hide(); 
    $('.navigation').removeClass("active"); 
}); 

그런 다음 그 후, 당신은 전파와이 인스턴스의 탐색을 숨기고에서 문서 이벤트를 중지 return false에 .navigation 클래스에 클릭 이벤트를 수정합니다.

$('.navigation').click(function() { 
    $(this).siblings('.navigation.active').click(); 
    $(this).toggleClass('active').next().toggle(); 
    return false; 
}); 

Mark도 지적한대로 event.StopPropagation()을 사용하여 전달을 중지 할 수 있습니다. 이 방법을 사용하는 경우 클릭/콜백 함수에 event을 인수/매개 변수로 전달해야합니다.

Answer 2

탐색을 숨기려면이 밖으로 시도 ...

$('.navigation').click(function(event) { 
    $(this).siblings('.navigation.active').click(); 
    $(this).toggleClass('active').next().toggle(); 
    event.stopPropagation(); 
}); 
$(document).click(function(event) { 
    $('.navigation.active').click(); 
    $('.navigation').removeClass("active"); 
}); 

이 DOM을 품어에서 이벤트를 중지 event.StopPropagation()을 사용합니다. 이후 우리는 단지 .navigation 요소를 클릭하면 숨기기를 트리거 할 수 있기 때문에.

예 : jsfiddle.