jquery阻止事件冒泡的代码
在js中,click、mouseove等称为事件。事件冒泡即是触发了这些事件产生的效果,禁止事件冒泡即是就算触发了这些事件也不会产生事件原有的效果。
事件冒泡大致分为两种,一种是HTML标签的默认行为,如a标签超链接跳转、form表单提交等;另一种是人为的给元素绑定某类事件,如click点击事件。因此阻止事件冒泡也分为两种代码
HTML代码:
<div class="go"> <a href="https://www.tddx.net/">跳转</a> </div> <div class="click"> <span>弹窗</span> </div>
阻止默认事件冒泡
添加下面的代码之后,点击a标签,也不会跳转到http://www.neirong.org
<script> $(function(){ $('.go a').click(function(event){ event.preventDefault(); }); }); </script>
阻止弹窗事件冒泡
添加下面的代码之后,点击span标签,原来弹窗效果就不会生效。
<script> $(function(){ $('.click span').click(function(event){ event.stopPropagation(); }); }); </script>
总结:两种事件阻止冒泡的区别只是preventDefault()和stopPropagation()的区别。
<< 上一篇
下一篇 >>