JavaScript如何实现事件的中断传播和行为阻止方法
这篇文章主要介绍JavaScript如何实现事件的中断传播和行为阻止方法，文中介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们一定要看完！
创新互联建站服务项目包括尼玛网站建设、尼玛网站制作、尼玛网页制作以及尼玛网络营销策划等。多年来，我们专注于互联网行业，利用自身积累的技术优势、行业经验、深度合作伙伴关系等，向广大中小型企业、政府机构等提供互联网行业的解决方案，尼玛网站推广取得了明显的社会效益与经济效益。目前，我们服务的客户以成都为中心已经辐射到尼玛省份的部分城市，未来相信会继续扩大服务区域并继续获得客户的支持与信任！
事件传播
MicroSoft的设计是当事件在元素上触发时，该事件将接着在该节点的父节点触发，以此类推，事件一直沿着DOM树向上传播，直到到达顶层对象document元素。这种自底向上的事件传播方式称为“事件冒泡”，也就是事件传播。
如何中断事件的传播？
stopPropagation() w3c取消冒泡
cancleBubble = true IE取消冒泡
取消事件默认效果：
returnValue = false IE 取消事件效果
defaultPrevent() w3c取消事件效果
#aa{
width: 600px;
height: 600px;
background: gray;
}
#bb{
width: 400px;
height: 400px;
background: green;
}
#cc{
width: 200px;
height: 200px;
background: red;
}捕捉写法停止传播 从最顶层开始往下
document.getElementById('aa').addEventListener('click',function (ev){alert('aa');ev.stopPropagation();},true);// 结果捕捉到aa 加true 由冒泡变为捕捉 从上到下
document.getElementById('bb').addEventListener('click',function (){alert('bb')},true);
document.getElementById('cc').addEventListener('click',function (){alert('cc')},true);冒泡写法停止传播 从下往上
document.getElementById('aa').addEventListener('click',function (){alert('aa');});//加true 由冒泡变为捕捉 从上到下
document.getElementById('bb').addEventListener('click',function (){alert('bb')});
document.getElementById('cc').addEventListener('click',
function (ev){
alert('cc');
ev.stopPropagation();
// ev.cancleBubble = true;//IE下 取消冒泡方法
}); //结果是冒出cc 停止传播
}取消事件效果
returnValue = false //IE 取消事件效果
preventDefault() //w3c取消事件效果
document.getElementsByTagName('a')[0].onclick = function (ev){
alert('点击');
//达到事件结束的效果 但是函数还是往下运行
//
ev.preventDefault();
alert('已经拦截');
}以上是“JavaScript如何实现事件的中断传播和行为阻止方法”这篇文章的所有内容，感谢各位的阅读！希望分享的内容对大家有帮助，更多相关知识，欢迎关注创新互联行业资讯频道！
网站标题：JavaScript如何实现事件的中断传播和行为阻止方法
文章路径：http://bzwzjz.com/article/jhhdgs.html
