jquery单击外部关闭

我制作了一个侧边导航菜单，点击按钮即可从左向右滑动

$(document).ready(function(){
  $("#nav-toggle").click(function(){
    $("#page").toggleClass("margin");
  });
});

单击“导航切换”按钮时，“页面”边距从0px增加到600px

    .margin {
margin-left:600px;width:380px;overflow-x:hidden
}


<div id="side-menu">

<nav>
    <a class="nav-links" href="#home">home</a>
    <a class="nav-links" href="#about">about</a>
    <a class="nav-links" href="#contact">contact</a>
</nav><!-- end of nav  -->

.margin{
左边距：600px；宽度：380px；溢出-x：隐藏
}

---

如何通过单击菜单外部来关闭菜单。

简单。。。使用此处介绍的学员：

$('body').on('click',function(event){
   if(!$(event.target).is('#nav-toggle')){
     $("#page").removeClass("margin");
   }
});

“检查直接和委托事件”

基本上我说的是。。。当用户单击文档上的任意位置且源不在#侧菜单内时：不（#侧菜单）从#导航切换中删除类边距

$(document).on({
   click: function(){
      $("#nav-toggle").removeClass("margin")
   }
},":not(#side-menu)");

---

如果我单击页面上的任何位置，它也会打开菜单。我该如何改变呢？我所做的也是将“body”改为“page”，因为当我点击导航时，它也关闭了它。我用HTML代替body，因为body高度是基于内容高度的。