点击远离它时隐藏DIV

mk_*_*_89 7 html javascript jquery

我基本上试图用html,css和jquery创建一个简单的下拉菜单,并且当用户点击它时,我很难关闭div.

我已经尝试过stopPropagation并在单击时将操作绑定到文档,它们要么不起作用,要么我不知道如何使用它们.无论如何看看下面的代码

HTML

<div id="optionsMenu">
   <a href="account.php?edit=info">Account Settings</a>    
</div>
Run Code Online (Sandbox Code Playgroud)

JQuery的

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

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

$('#optionsMenu').blur(function(){
   $('#optionsMenu').css("display","none");
});
Run Code Online (Sandbox Code Playgroud)

任何帮助都会很有帮助.

小智 10

你应该使用stopPropagation:

$(body).click(function(e)
{
   $('#optionsMenu').slideUp('fast');
});
$('#optionsMenu').click(function(e)
{
   e.stopPropagation();
});
Run Code Online (Sandbox Code Playgroud)