点击页面空白处关闭气泡或弹层
1 点击div（更多）会出现一个气泡
2再次点击div或页面上除了气泡之外的地方，气泡关闭 如下图所示 :
解决方法：
<html>
<div
class="no-solved"
id="moreList"
ng-class="{'active':moreSupply}"
ng-click="moreSomething()">更多</div>
<div
class="bubble"
ng-show="moreSupply"
id="detailList">
<div
class="tag"
ng-model="bubbleList">
<div
class="tag-title"
ng-click="doMore()">指派工程师</div>
<div
class="tag-title"
ng-click="doMore()">驳回</div>
<div
class="tag-title"
ng-click="doMore()">申请挂起</div>
<em></em>
</div>
</div>
</html>
<script>
//底部气泡框显示和隐藏
//点击更多显示与隐藏气泡
var
oMoreList
=
document.getElementById("moreList");
oMoreList.addEventListener("click",function(event){
$scope.moreSupply=!$scope.moreSupply;
event=event||window.event;
event.stopPropagation();//阻止事件冒泡,防止隐藏
});
//点击气泡列表不隐藏
var
oDetailList
= document.getElementById("detailList");
oDetailList.addEventListener("click",function(event){
$scope.moreSupply=true;
event=event||window.event;
event.stopPropagation();//阻止事件冒泡
});
//点击页面空白处隐藏气泡
document.addEventListener("click",function(){
$scope.moreSupply=false;
$scope.$apply();//隐藏气泡
});
</script>
总结：点击气泡里的div时会触发document的监听事件，所以要用event.stopPropagation阻止父级的点击事件