取消 javascript/jQuery 中的“on”事件

【问题标题】：Cancel 'on' event in javascript/jQuery取消 javascript/jQuery 中的“on”事件
【发布时间】：2015-01-19 16:03:38
【问题描述】：

我的代码中有以下 jQuery 脚本，它在 css 动画结束时执行：

    $('.player').on('webkitAnimationEnd', function() {
        gameOver();
    });

我想知道如何取消或取消设置，以便在动画结束时不再执行 gameOver 功能。

谢谢。

【问题讨论】：

api.jquery.com/off。在这里提问之前阅读文档总是一个好主意。
“要删除与.on() 绑定的事件，请参阅.off()。要附加只运行一次然后自行删除的事件，请参阅.one()” - 首先.on() doc的一段
使用 one() api.jquery.com/one
@abhitalks 它只会删除绑定到通过选择器传递的元素的 webkitAnimationEnd 事件的所有实例，但您始终可以为其命名空间，以便仅删除该实例。
这个问题似乎离题了，因为它没有显示任何解决问题的努力

标签： javascript jquery css javascript-events

【解决方案1】：

选项 1：.one()

这将运行一次并且永远不会再次运行，直到再次绑定此代码。

$('.player').one('webkitAnimationEnd', function() {
    gameOver();
});

http://api.jquery.com/one/

选项 2：.off()

这样使用：

$('.player').on('webkitAnimationEnd', function() {
     gameOver();
});

function gameOver() {        
     $('.player').off('webkitAnimationEnd');
}

http://api.jquery.com/off/

选项 3

如果你有多个动画事件绑定到同一个元素，使用命名空间来区分：

$('.player').on('webkitAnimationEnd.gameOver', function() {
        gameOver();
});

function gameOver() {        
     $('.player').off('webkitAnimationEnd.gameOver');
}

【讨论】：

用 DOM 逻辑污染gameOver 域逻辑并不是很吸引人。打完gameOver之后打off就行了。