function ifParentObj(obj,parentObj){
while (obj != undefined && obj != null && obj.tagName.toUpperCase() != 'BODY'){
if (obj == parentObj){
return true;
}
obj = obj.parentNode;
}
return false;
}
demo :点击非菜单触发按钮及菜单区域隐藏菜单
<div class="nav-bar bg-grey main-body" @click="hideDropList($event)">
<div id="dropBody" slot-scope="_" :width="30" class="relative">
<i class="fa fa-caret-down fa-2x" @click="showDropList"></i>
<drop-down
class="drop-list-body"
:dropList="dropList"
:listData="listData"
></drop-down>
</div>
</div>
hideDropList(e) {
let evt = e.srcElement ? e.srcElement : e.target;
let parentO=document.getElementById("dropBody");
// if itself and it's children then do nothing,else hide
if (evt.id == "dropBody"||this.isParentObj(evt,parentO)) return;
else {
this.dropList = false;
}
}
网友评论