CSS重复动画而不使用animation-iteration-count

Question

我正在尝试用JQuery编写Simon Says游戏，但遇到了麻烦。

由于某种原因，如果我的“闪存序列”中有重复项，则只有一个实例闪烁。

即game.displaySequence( [ 1, 1 ] );仅闪烁一次，而

game.displaySequence( [ 3, 1, 4, 2 ] );工作正常。

由于我的设置方式，animation-iteration-count可能无关紧要。

我已经研究了这个问题，并尝试了各种建议，例如在每个动画之后都删除动画类，但是没有运气。

代码在下面-非常感谢您的帮助。

JS / jQuery：

game = {

    // Game constants
    flashSpeed: 0.4,

    // Display sequence to player
    displaySequence: function( seq ) {
        seq.forEach( function( val, pos ) {
            // Flash element based on list contents
            $( "#box" + val ).css( "animation", "blinker " + game.flashSpeed + "s linear " + pos * game.flashSpeed + "s 1" );

        } );
    }
}

CSS：

@keyframes blinker {
  50% {
    opacity: 1;
  }
}