我将 transitionend
事件绑定(bind)到 div1
。当 div1
的转换结束时,事件开始运行。没问题。
我遇到了一个特例:
我在这个div1
中添加了3个段落,当每个段落的过渡结束时,div1
的transitionend
事件也运行了。所以 transitionend
事件运行了 4 次。 >.<
在 div1
的 transitionend
事件的监听器函数体中,我可以看到 event.target
!== this
。我觉得这很荒谬!
Chrome 和 Firefox 都有这个问题。所以我猜这不是浏览器的 HTML5 规范实现错误。
谁能解释为什么元素的 transitionend
事件也可以被该元素的子元素触发?
谢谢。
最佳答案
这称为事件冒泡。默认情况下,在对原始对象调用事件处理程序后,子元素上发生的许多事件将通过父元素向上冒泡。您可以通过检查 event
对象来检测冒泡,也可以通过在处理源对象上的事件时停止传播来防止冒泡。
停止传播是 IE 与其他浏览器的不同之处之一。在其他浏览器中,您调用:
event.stopPropagation()
IE9之前的IE:
window.event.cancelBubble = true;
关于html - 为什么当元素的 child 的过渡结束时可以运行 transitionend 事件?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/12022336/