部分业务要求除了某元素外点击其他对象，对应的元素隐藏，下面是一个demo效果，
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>demo</title>
<style type="text/css">
.fun-set-bg{100%;height:100%;overflow-x:hidden;overflow-y:auto;}
.maskTask{ 100%;position: fixed;opacity: .5;left: 0;top: 0;height: 100%;z-index: 1;background-color: #000;display: none;}
.maskCone{ 70%;position: fixed;background-color: #fff;z-index: 2;height: 30%;left: 15%;top: 5%;border-radius: 5px;padding: 10px 20px;display: none;}
#btns{padding: 2px 8px;border-radius: 3px;}
</style>
</head>
<body>
<div class="fun-set-bg">
demo样式-
<button class="starts">出现</button>
</div>
<div class="maskTask"></div>
<div class="maskCone">
<p>阿部察察错错</p>
<button id="btns">取消</button>
</div>
<script type="text/javascript" src="../../js/jquery_v3.3.1.js"></script>
<script>
$(function(){
$(".starts").click(function(event){
var e=window.event || event;
if(e.stopPropagation){
e.stopPropagation();
}else{
e.cancelBubble = true;
}
$(".maskCone,.maskTask").show();
});
$(".maskCone").click(function(event){
var e=window.event || event;
if(e.stopPropagation){
e.stopPropagation();
}else{
e.cancelBubble = true;
}
});
$(document).click(function(event) {
$(".maskCone,.maskTask").hide();
});
$('#btns').click(function(event) {
$(".maskCone,.maskTask").hide();
});
})
</script>
</body>
</html>