点击空白处隐藏相应的元素

点击空白处隐藏相应的元素

布局

点击此处打开弹出层
点击空白处关闭弹出层

控制

  $(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)
        }
    });

这些都可以理解的不在详解
结束！！！！！！！！