在项目中遇到的问题，因为是手机端的遮罩层，为了给用户更好的体验，需要在遮罩层中点击没有内容的地方讲遮罩层进行隐藏
这个主要用的知识点是事件的冒泡和捕获
事件的冒泡：是从里向外，DOM的层次像冒泡一样，不断的向上一级上升
事件的捕获：是从外向里
注意：1.ie只有事件的冒泡没有事件的捕获
2，事件的捕获会先发生
例子：
<style> .popup {display:none;position:fixed;width:100%;height:100%;left:0;top:0;z-index:300;background:rgba(0,0,0,0.6);filter:Alpha(opcity=60);overflow: auto;} .abc{width: 100%;height: 100px;background-color: wheat} .popup_hide{background-color: white;width: 100%;height: 100px;} </style>
<div class="abc"> 点我出现遮罩层哦 </div> <div class="popup"> <div class="popup_hide"> asdfghjbvcsa </div> </div>
<script> $('.abc').on("click",function(){ $('.popup').show(); }); $(".popup").on("click",function(){ $(this).hide(); }); $(".popup .popup_hide").on("click",function(e){ e.stopPropagation(); }) </script> 解析：点击的popup使整个遮罩层进行隐藏，点击内容块（.popup_hide）阻止了事件的冒泡，使popup_hide的父元素popup阻止，不会触发了这个事件
从而使点击popup_hide以外的内容将遮罩层进行隐藏
注意：引入jquery哦
