JQuery пользовательских выпадающее выбрать окно не скрывая

Question

У меня есть кнопка «кнопка», которая активирует «окно» раскрывающийся коробе:

$('.button').click(function() 
{   
    $(this).siblings(".box").toggle(); 
}); 

Everytime нажата кнопка шкуры выпадающего списка или показывает

$('.box').blur(function() 
{ 
    $(this).hide(); 
}); 

Теперь я хочу реализовать размытие, так что когда пользователь щелкает что-то, кроме раскрывающегося окна, ящик скрывается.

НО

Теперь, когда я нажимаю кнопку в то время как выпадающий открыт, он закрывается и вновь открывается. Я чувствую, что застрял в Catch-22.

Проблема в том, что размытие и .click срабатывают, когда я нажимаю кнопку, когда раскрывающийся список открыт.

Answer 1

Вместо того, чтобы использовать размытие, искать щелчком в любом месте документа, но предотвратить бурлит при нажатии на поле или кнопку.

$('.button').click(function(event) { 
    $(this).siblings('.box').toggle(); 
}); 
$('html').click(function() { 
    $('.box').hide(); 
}); 
$('.box, .button').click(function() { 
    event.stopPropagation(); 
}); 

http://jsfiddle.net/bLdtz/

Answer 2

$('.box').blur(function() 
{ 

    if($(this).is(":visible"))  
    $(this).toggle(); 

}); 

Answer 3

Попробуйте

$('.box').blur(function(event) 
{ 
    $(this).hide(); 
    event.stopPropagation(); //prevent event from bubbling up the DOM 
});