jQuery 事件冒泡

来源：互联网发布：淘宝情趣记事by欲晓编辑：程序博客网时间：2024/06/05 04:57

<!DOCTYPE html><html><head><meta charset="utf-8" /><script type="text/javascript" src="js/jquery-3.1.1.min.js" ></script><link rel="stylesheet" href="css/style.css" /><title></title><script>$(function(){var count = 0 ;$("div,p,input").on("click",function(){alert(count++) ;}) ;}) ;  </script></head><body> <div><p><input type="button" value="按钮"/></p></div> </body></html>

这样就会产生事件冒泡。会连续三个弹窗。

阻止事件冒泡

event.stopPropagation() ;

<!DOCTYPE html><html><head><meta charset="utf-8" /><script type="text/javascript" src="js/jquery-3.1.1.min.js" ></script><link rel="stylesheet" href="css/style.css" /><title></title><script>$(function(){var count = 0 ;$("div,p,input").on("click",function(){alert(count++) ;event.stopPropagation() ;}) ;}) ;  </script></head><body> <div><p><input type="button" value="按钮"/></p></div> </body></html>

阻止了冒泡。只会产生一个弹窗。

0 0