本篇内容介绍了“JavaScript事件冒泡机制原理是什么”的有关知识，在实际案例的操作过程中，不少人都会遇到这样的困境，接下来就让小编带领大家学习一下如何处理这些情况吧！希望大家仔细阅读，能够学有所成！
DOM事件流（event flow ）存在三个阶段：事件捕获阶段、处于目标阶段、事件冒泡阶段，事件冒泡顺序是由内到外进行事件传播，事件冒泡是由IE开发团队提出来的，即事件开始时由最具体的元素（文档中嵌套层次最深的那个节点）接收，然后逐级向上传播。
听了简介介绍之后，您可能不理解，所以举个例子：
<html><head><title>js事件冒泡测试</title></head><body><p id='content' onclick='alert("content")'><p id='p' onclick='alert("p");'><ul onclick='alert("ul");'><li onclick='alert("li");'>test</li></ul></p></p></body></html>点击test页签，会依次执行li的onclick、ul的onclick、p的onclick，content的onclick，从内到外执行，所以这个就是冒泡事件的简单例子
最近也遇到了这种情况，所以就去网上搜索资料，简单学习一下，就是点击一个按钮的时候，竟然触发了两次，通过排查，发现了冒泡机制导致的，解决方法是禁用事件冒泡机制
w3c的方法是e.stopPropagation()，IE则是使用e.cancelBubble = true
$(element).click(function(e){ e.stopPropagation();//ie e.cancelBubble = true});当然除了冒泡机制会导致onclick被调用两次外，事件被绑定2次的情况也有可能，解决方法是解除事件，然后再绑定
$(element).unbind('click').click(function() { // todo})“JavaScript事件冒泡机制原理是什么”的内容就介绍到这里了，感谢大家的阅读。如果想了解更多行业相关的知识可以关注亿速云网站，小编将为大家输出更多高质量的实用文章！
免责声明：本站发布的内容（图片、视频和文字）以原创、转载和分享为主，文章观点不代表本网站立场，如果涉及侵权请联系站长邮箱：is@yisu.com进行举报，并提供相关证据，一经查实，将立刻删除涉嫌侵权内容。
