1. 推荐写法
$(document).mouseup(function(e) {
var pop = $('popDialog');
if(!pop.is(e.target) && pop.has(e.target).length === 0) {
// 可以在这里关闭弹窗
some code...
}
});
判断点击事件发生在区域外的两个条件:
- 点击事件的对象不是目标区域本身
- 事件对象不是目标区域的子元素
2. 普通写法
var btn = document.getElementById('btn');
var pop = document.getElementById('pop');
// 点击 btn 显示或隐藏弹窗
btn.onclick = function() {
if(pop.style.display === "none") {
pop.style.display = "block";
} else {
pop.style.display = "none";
}
}
// 点击整个界面关闭弹窗
document.onclick = function() {
div.style.display = "none";
}
// 防止点击弹窗也关闭弹窗,需要防止其关闭
pop.onclick = function() {
return false;
}