在窗口單擊關閉畫布菜單

Question

我做了這個“滑出”菜單： SASS滑出菜單 。
沒關系，但我希望當菜單滑動時，在窗口上單擊菜單返回（刪除類“nav-open”）。
我在codepen演示中試過這個，但它不起作用：

window.on("click", function(e) {
    if(wrapper.hasClass("nav-open") && e.target != nav && e.target.parent() != nav) {
        wrapper.removeClass("nav-open");
    }
});

Answer 1

你很親密！ 我認為你的codepen示例需要關閉邏輯塊調整，如下所示：

  $(window).on("click", function(e) {
    if (
      wrapper.hasClass("nav-open") && 
      !$(e.target).parents(nav).hasClass("side-nav") && 
      !$(e.target).hasClass("toggle")
    ) {
        wrapper.removeClass("nav-open");
      }
  });

一些提示：

1. 使用$（window）.on not window.on
2. e.target是一個DOM元素，所以你需要將其包裝在jQuery中，如$（e.target）
3. 您可以比較DOM元素，但不能比較jQuery對象，因此您可以使用hasClass
4. 我添加了一個檢查以忽略切換本身的單擊

forked codepen與工作代碼： http ：//codepen.io/anon/pen/mzAru