jQuery 是否有，或者是否有一个 jQuery 插件，具有用于监听 CSS3 动画事件的内置函数（例如 animationEnd）？答案

【问题标题】：Does jQuery have, or is there a jQuery plugin, with a built-in function for listening to CSS3 animation events (e.g. animationEnd)?jQuery 是否有，或者是否有一个 jQuery 插件，具有用于监听 CSS3 动画事件的内置函数（例如 animationEnd）？
【发布时间】：2012-07-16 16:36:17
【问题描述】：

我环顾四周，找不到任何东西。在我的应用程序中，为了触发元素上的动画，我向元素添加了一个具有所需动画的类。然后我想监听动画结束事件并在它被触发时运行一些代码。

据我所知，jQuery 还没有以 跨浏览器 的方式实现此功能（例如 $(document).on('animationEnd', 'selector', callback)）。

虽然手动实现这一点很容易，但我想知道是否有可用的第三方库可以做到这一点？

【问题讨论】：

标签： javascript jquery css cross-browser

【解决方案1】：

试试：

transitionend
webkitTransitionEnd
oTransitionEnd
MSTransitionEnd

你可以使用类似的东西：

$('#yourelement').addClass('animatedClass').on('transitionend', function(e) {
 // ... do stuff.
);

还有

 :animated

您可以对其进行测试，

 if ( $('#yourelement:not(:animated)') ) { ...
 if ( $('#yourelement').is(':animated') ) { ...

希望能让你走上正确的道路 =)

【讨论】：

谢谢，但我感兴趣的事件实际上是animationEnd。而我一直在寻找的是一个允许我编写 $(foo).on('animationEnd', ...) 而不是 $(foo).on('webkitAnimationEnd mozAnimationEnd oAnimationEnd msAnimationEnd animationEnd', ...) 的库。

【解决方案2】：

同时收听所有前缀事件。

【讨论】：