鼠标点击弹出层区域外关闭层

来源:互联网 发布:淘宝卖家修改快递单号 编辑:程序博客网 时间:2024/06/07 02:43
<input id="btn" type="button" value="显示DIV" />


   <div id="myDiv" style="width:200px; display:none; background:#0CF; border:2px solid #09F; padding:10px;"> 
<a href="http://demo.xiaomayi.co/" target="_blank"><img src="http://demo.xiaomayi.co/upload/site/2015-1-31/201513118202010258fgf.jpg"  width="100" height="100"  /></a>
<p>真正的有用</p></div>


<script type="text/javascript"> 


$(function () { 
$("#btn").click(function (event) { 
  $("#myDiv").fadeIn();
$(document).one("click", function () {//对document绑定一个影藏Div方法 
$("#myDiv").fadeOut(); 
}); 
event.stopPropagation();//阻止事件向上冒泡 
}); 
$("#myDiv").click(function (event) { 
event.stopPropagation();//阻止事件向上冒泡 
}); 
});   
</script>
0 0