jquery / javascript事件处理程序运行两次而不是一次 - transitionend

Question

我正在探索来自css 3中的转换的可能性，但遇到了捕获转换结束事件的事件侦听器的奇怪行为。我的代码如下所示：

var box = document.getElementById('someDiv').addEventListener( 'transitionend', 
    function( event ) { event.preventDefault(); $('.it-text').toggleClass('it-animate'); console.log('the end') }, false );

转换工作正常但日志显示两次回调运行函数。我也看到这发生在这里：

jsfiddle example

为什么它会运行两次以及如何防止它？它有什么冒泡的吗？

Kalreg。

编辑：

鉴于解决方案下面的解决方案只是部分工作 - 我使用了jquery和“one”事件处理程序，但它仍然没有按预期工作 - 我希望通过在DOM对象上切换类来进行无限循环转换。不幸的是'.on'运行两次虽然调用一次并且切换到地狱，并且'.one'按预期运行只有dso它没有做任何循环:( 有什么想法吗？

var box = document.getElementById('someDiv');
$(box).on('transitionend', function ( e ) { $(box).toggleClass('myclass'); console.log('end')})