漢堡響應按鈕單擊事件BUG

Question

我有一個惱人的漢堡按鈕錯誤。我在stackoverflow上發現如何隱藏下拉菜單，當它在文檔的其他地方點擊時，但這導致了一個錯誤，如果我想關閉菜單再次點擊漢堡包圖標它隱藏一秒鐘並顯示返回再次。

建議我做錯了什麼？

更新：這裏是http://jsfiddle.net/scuzgvmq/ 點擊按鈕來了slideDown，然後單擊agian看到BUG

$('.hamburger').click(function() { 
    $('#header .responsive-menu').slideToggle(); 
}); 

$(document).mouseup(function (e) { 
    var container = $("#header .responsive-menu"); 

    if (!container.is(e.target) // if the target of the click isn't the container... 
    && container.has(e.target).length === 0) // ... nor a descendant of the container 
    { 
     container.hide('slow'); 
    } 
}); 

HTML

<ul class="responsive-menu"> 
    <li>Example</li> 
    <li>Example</li> 
    <li>Example</li> 
</ul> 

<div class="hamburger"></div> 

Answer 1

你需要檢查觸發心不是漢堡包按鈕或者像this fiddle

$(document).ready(function() { 
     var container = $(".responsive-menu"); 
     var hamburger = $(".hamburger"); 

     hamburger.on('click', function() { 
      container.slideToggle(); 
      container.addStyle('display:block'); 
     }); 

     $(document).on('mouseup', function (e) { 

      if (!container.is(e.target) && !hamburger.is(e.target) && container.has(e.target).length === 0) // ... nor a descendant of the container 
      { 
       container.hide('slow'); 
      } 
     }); 
    });