84669 Lernen von Personen
152542 Lernen von Personen
20005 Lernen von Personen
5487 Lernen von Personen
7821 Lernen von Personen
359900 Lernen von Personen
3350 Lernen von Personen
180660 Lernen von Personen
48569 Lernen von Personen
18603 Lernen von Personen
40936 Lernen von Personen
1549 Lernen von Personen
1183 Lernen von Personen
32909 Lernen von Personen
如图,我有一个弹窗想点击除轮播区域外的地方关闭弹窗,点击切换按钮实现切换图片
代码如下
$('.cut-model').bind('click',function(e){ $(this).hide();//点击空白区域关闭弹窗}) $('.round').bind('click',function(e){ e.stopPropagation();//点击切换按钮阻止冒泡})
然而。。。。并没有成功,点击切换按钮时弹窗仍然关闭,请教各位大神是什么原因,我写的不对吗?谢谢
请教关于jquery阻止冒泡的问题?-PHP中文网问答-请教关于jquery阻止冒泡的问题?-PHP中文网问答
围观一下哦,学习一下。
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Title</title> <script type="text/javascript" src="jquery.min.js"></script> <style> .over-lay{ width: 300px; height: 300px; position: absolute; left:50px; top:50px; background-color: rgba(235,235,235,0.5); } .over-lay.hide{ display: none; } .content{ background-color: green; width: calc(100% - 60px); height: calc(100% - 0px); border-radius: 10px; position: absolute; left: 30px; top: 0px; } .back-button,.forward-button{ width: 30px; height: 30px; position: absolute; top:calc(50% - 15px); left:0px; background-color: red; font-size: 12px; } .forward-button{ right:0px; left:auto; } </style> <script> $(function(){ $(".over-lay").on("click",".back-button,.forward-button",function(event){ console.log("不关闭overlay"); event.stopPropagation();//阻止冒泡到.over-lay }); $(".over-lay").on("click",function(event){ console.log("关闭overlay"); $(this).addClass("hide"); }); }); </script> </head> <body> <div> <div class="back-button">后退</div> <div></div> <div class="forward-button">前进</div> </div> </body> </html>
请教关于jquery阻止冒泡的问题?-PHP中文网问答-请教关于jquery阻止冒泡的问题?-PHP中文网问答
围观一下哦,学习一下。