在弹框区域外点击,关闭弹框
思路
弹框最外层套个id,监听文档点击事件,循环查找父级id,判断是否包含在外层id中,包含不处理,不包含弹窗关闭
注意点
具体问题具体分析,如html层级解构混乱时,需加入额外判断来处理,但整体思想不变
例子,vue中使用
document.addEventListener("click", e => {
if (!this.overMark && this.showArrow) {
let el = e.target;
while (el) {
if (el.id == "menu-box") {
return;
}
el = el.parentNode;
}
this.showArrow = false;
}
});