jQuery实现点击弹出框外界面关闭弹框
通过jQuery的closest方法实现点击弹框以外的部分关闭弹框。
closest() 方法返回被选元素的第一个祖先元素。具体用法:https://www.runoob.com/jquery/traversing-closest.html
$(document).ready(function() { $("body").click(function(e) { if ($(e.target).closest("#touch,#miss").length == 0) { //length等于0执行 $("#miss").hide(); $("#phone").css("filter", "brightness(100%)"); } }); $("#touch").click(function() { //弹出框 $("#miss").fadeIn("slow"); $("#phone").css("filter", "brightness(50%)"); }) })
点击id为touch的button时,closest("#touch,#miss),匹配到#touch本身,length为1,弹出弹框。弹出弹框后,点击弹框本身length为1,点击弹框外均为0,达到关闭效果
相关推荐
EdwardSiCong 2020-11-23
85477104 2020-11-17
hhanbj 2020-11-17
81427005 2020-11-11
seoppt 2020-09-13
honeyth 2020-09-13
WRITEFORSHARE 2020-09-13
84483065 2020-09-11
momode 2020-09-11
85477104 2020-08-15
83510998 2020-08-08
82550495 2020-08-03
tthappyer 2020-08-03
84901334 2020-07-28
tthappyer 2020-07-25
TONIYH 2020-07-22
tztzyzyz 2020-07-20
83510998 2020-07-18
81463166 2020-07-17