jQueryのカスタムドロップダウン選択ボックスIは、ドロップダウンボックス「ボックス」を活性化し、ボタン「ボタン」を持っている

Question

を隠していない。

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

毎回ボタンをクリックするとドロップダウンボックスが

$('.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 
});