jQuery one() 处理程序执行了两次

Question

我的 jQuery/animate.css 代码中有一个错误。问题是一个事件处理程序被调用了两次，但它应该只执行一次。你可以在这里找到代码，重要的行如下：

JSFiddle

$('#tiles').addClass(tiles_in).one(animation_end, function() {
    // called twice
    log('tiles in');
});

要重现错误，请按照下列步骤操作：

• 等待动画结束，会输出这些日志
  • change_tiles
  • tiles out
  • tiles in
• 点击黄色的div，这里是新日志
  • tile out // normal
  • tiles in // why ?

Tiles in 不应再次调用，因为事件是 one()。文档说 "The .replaceWith() method removes all data and event handlers associated with the removed nodes." 所以我不知道。

Answer 1

why ?

对 .one() 的调用在第一个 .one() 事件处理程序中进行，其中事件附加到同一个选择器 #tiles

Answer 2

我在记录被触发的事件后自己找到了它。

https://jsfiddle.net/uhz6Ly0s/8/

$('#tiles').addClass(tiles_in).one(animation_end, function(event) {
    log('tiles in, event=' + event.type);
});

第一个事件是animationend，第二个事件是webkitAnimationEnd。由于某些原因，第二个在点击事件结束时触发。