DIVをクリックして隠すときにDIVを非表示にする

Question

基本的には、html、css、jquery の単純なドロップダウンメニューを作成しようとしていて、ユーザーがクリックしたときにdivを閉じるのに問題があります。

私はstopPropagationを試して、クリックしたときにアクションをドキュメントにバインドしましたが、それらは動作しないか、それらを使用する方法がわかりません。とにかく

HTML

<div id="optionsMenu"> 
    <a href="account.php?edit=info">Account Settings</a>  
</div> 

次のコードはJQuery

$('.options').click(function(){ 
    if($('#optionsMenu').css("display") == 'none'){ 
     $('#optionsMenu').slideDown("fast"); 
    } 

    else{ 
     $('#optionsMenu').slideUp("fast"); 
    } 
}); 

$('#optionsMenu').blur(function(){ 
    $('#optionsMenu').css("display","none"); 
}); 

を見ているすべてのヘルプは非常ににappriciatedされるだろう。

Answer 1

あなたはのstopPropagation使用する必要があります：返信用

$(body).click(function(e) 
{ 
    $('#optionsMenu').slideUp('fast'); 
}); 
$('#optionsMenu').click(function(e) 
{ 
    e.stopPropagation(); 
}); 

Answer 2

あなたはon()を使用することができ、おそらく：

$('body').on('click', function(e){ 
    if ($(e.target).not('#optionsMenu')){ 
     $('#optionsMenu').slideUp('fast'); 
    } 
}); 

上記まだテストしていない、しかし、私は仕事を考える必要があります。