点击空白处隐藏相应的元素
布局
<body>
<div id="box"></div>
<span class="btn">点击此处打开弹出层</span><br>点击空白处关闭弹出层
</body>
控制
$(function(){
$(".btn").click(function(event){
var e=window.event || event;
if(e.stopPropagation){
e.stopPropagation();
}else{
e.cancelBubble = true;
}
$("#box").show();
});
$("#box").click(function(event){
var e=window.event || event;
if(e.stopPropagation){
e.stopPropagation();
}else{
e.cancelBubble = true;
}
});
document.onclick = function(){
$("#box").hide();
};
})
或者
$(document).mouseup(function(e){
var _con = $('.box'); // 设置目标区域
if(!_con.is(e.target) && _con.has(e.target).length === 0){ // Mark 1
$(".box").hide();
console.log(1)
}else{
console.log(2)
}
});
这些都可以理解的不在详解
结束!!!!!!!!