喵喵喵 » 建站笔记 » 本页
 °

jq点击空白关闭弹出层



点击黑色方块打开绿色方块,点击周边空白关闭绿色方块

需要jq支持

<div style="height:100px;width:100px;">
	<div class="btn" style="height:50px;width:100px;background:black;">
	</div>
	<div id="box" style="height:50px;width:100px;background:green;display:none;">
	</div>
</div>
<script type="text/javascript">  
$(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();  
    };  
})  
</script>  
完美啊完美,正中下怀呢!
打赏
  喜欢