为什么在元素的子元素转换结束时可以运行transitionend事件？

Question

我绑定了一个transitionend活动div1.当div1转换结束时,事件就开始了.这里没有问题.

我遇到了一个特例:

我加了3段来此div1,当每个段落的过渡结束时,div1的transitionend事件也跑了.因此,transitionend事件跑了4倍.> <

在div1's transitionendevent的监听器功能的主体中,我可以看到event.target!== this.我觉得这很荒谬!

Chrome和Firefox都有这个问题.所以我想这不是浏览器的HTML5规范实现错误.

谁能解释为什么元素的transitionend事件也可以被这个元素的子元素触发？

谢谢.

Answer 1

这称为事件冒泡.默认情况下,在源元素上调用事件处理程序后,子元素上发生的许多事件将通过父元素冒泡.您可以通过检查event对象来检测冒泡,也可以通过在源对象上处理事件时停止传播来防止冒泡.

停止传播是IE与其他浏览器不同的事情之一.在其他浏览器中,您调用:

event.stopPropagation()

在IE9之前的IE中:

window.event.cancelBubble = true;