点击弹出层以外的区域隐藏弹出层

我们店显示弹出层后，想让其消失，但又不想添加“X”来关闭，可以使用点击弹出层以外的区域来让该层消失的办法。下面如代码：

$(".btn3").click(function(e){

e.stopPropagation();//阻止事件向上冒泡   

$(".con-share").removeClass("hide");

}) //显示弹出层

 

$(document).click(function(e){

if(!$(".con-share").hasClass("hide")){

    $(".con-share").addClass("hide")

}  

})//判断弹出层是否包含“hide”，没有则添加该属性，隐藏弹出层。

 

$(".con-share").click(function (e) { 

e.stopPropagation();//阻止事件向上冒泡 

});

 

这个例子中需要注意冒泡事件。禁止冒泡事件的出现。