Javascript 事件转换不为'；Safari 7.0.2和；Safari 6.1

我遇到一个问题，我的产品代码将事件

transitionend

绑定到元素。但Chrome 33、Safari 7.0.2和Safari 6.1不会触发此事件。我的代码可以在Firefox 27.0.1上正常工作。我的代码过去在Chrome的旧版本如25和Safari的6.0.5上运行良好

所以我开始重现这个问题。以下是复制代码：

<p>The box below combines transitions for: width, height, background-color, transform. Hover over the box to see these properties animated.</p>
<div class="box"></div>

.box {
    border-style: solid;
    border-width: 1px;
    display: block;
    width: 100px;
    height: 100px;
    background-color: #0000FF;
    -webkit-transition:width 2s, height 2s, background-color 2s, -webkit-transform 2s;
    transition:width 2s, height 2s, background-color 2s, transform 2s;
}
.box:hover {
    background-color: #FFCCCC;
    width:200px;
    height:200px;
    -webkit-transform:rotate(180deg);
    transform:rotate(180deg);
}

document.querySelector('.box').addEventListener('webkitTransitionEnd', function () {
    console.log('Transition End.');
}, false);

document.querySelector('.box').addEventListener('msTransitionEnd', function () {
    console.log('Transition End.');
}, false);

document.querySelector('.box').addEventListener('oTransitionEnd', function () {
    console.log('Transition End.');
}, false);

document.querySelector('.box').addEventListener('transitionend', function () {
    console.log('Transition End.');
}, false);

下面的框组合了以下变换：宽度、高度、背景色、变换。将鼠标悬停在长方体上以查看这些属性的动画效果

.盒子{
边框样式：实心；
边框宽度：1px；
显示：块；
宽度：100px；
高度：100px；
背景色：#0000FF；
-webkit变换：宽度2s，高度2s，背景色2s，-webkit变换2s；
过渡：宽度2s，高度2s，背景色2s，变换2s；
}
.box:悬停{
背景色：#FFCCCC；
宽度：200px；
高度：200px；
-webkit变换：旋转（180度）；
变换：旋转（180度）；
}
document.querySelector（'.box'）.addEventListener（'WebKittTransitionEnd'，function（）{
log（'transitionend'）；
}，假）；
document.querySelector（'.box'）.addEventListener（'msTransitionEnd'，function（）{
log（'transitionend'）；
}，假）；
document.querySelector（'.box'）.addEventListener（'otTransitionEnd'，function（）{
log（'transitionend'）；
}，假）；
document.querySelector（'.box'）.addEventListener（'transitionend'，function（）{
log（'transitionend'）；
}，假）；

jsFiddle：

复制代码在Safari 7.0.2上无法工作。但他们可以在Chrome33上工作

我想让我的代码在最新的Chrome和Safari上运行。从我的复制代码中，你可以看到

transitionend

在Safari和Chrome上都不起作用。但在我的产品上，它在Chrome上也不起作用

---

多谢各位

我建议试试这个插件。。它使用CSS3转换，您可以在完成时传递函数以运行。。也在safari工作。。很抱歉我不想用这个插件来解决这个问题。