菜单 div 向上滑动外部单击答案

【问题标题】：Menu div slideup outside click菜单 div 向上滑动外部单击
【发布时间】：2013-09-04 06:14:31
【问题描述】：

<a class="btn">Click ME </a>

<div class="content">
    Content
</div>

$('.btn').click(function(){
    $('.content').slideToggle();
});

小提琴here

工作正常，但我的问题是当我们点击外部 .btn 按钮时需要向上滑动 div.content

谢谢

【问题讨论】：

标签： jquery html slideup

【解决方案1】：

$('.btn').click(function(e){
     $('.content').slideToggle();
     e.stopPropagation();
});

$(document).click(function(){
     $('.content').slideUp();
})

工作Fiddle

【讨论】：

【解决方案2】：

试试这个，我觉得更实用更简单的代码

$('.btn').click(function(){
    $('.content').delay(100).slideDown( function(){
});

});
$('html').click(function(){
  if( $('.content').is(':visible') ) {
     $('.content').slideUp();
  }
});

Demo

【讨论】：

【解决方案3】：

使用以下代码：

$("body").click
(
  function(e)
  {   
    if(e.target.className !== "btn")
    {
      $('.content').slideToggle();
    }
  }
);

http://jsfiddle.net/zFUUq/5/

【讨论】：

【解决方案4】：

试试

$('.btn').click(function(){
    $('.content').slideToggle();
    return false;
});

$(document).click(function(e){
    if(!$(e.target).closest('.content').length){
        $('.content').slideUp();
    }
})

演示：Fiddle

【讨论】：

【解决方案5】：

它的作用是查找所有点击。

如果点击不是在内容上，也不是在btn上，它会向上滑动菜单。

 $(document).click(function(e){
    if (!$(e.target).hasClass('content') &&  !$(e.target).hasClass('btn') ) {
         $('.content').slideUp();
    }
});

【讨论】：

【解决方案6】：

工作DEMO

试试这个

$('.btn').click(function (event) {
    $('.content').slideToggle();
    event.stopPropagation();
});
$(document).click(function() {
   $('.content').slideUp();
});

【讨论】：