檢測哪個AnimationEnd通過動畫名稱觸發了

Question

我有幾個鏈接到一個div的CSS3動畫，但我只想要一個函數在最後一個動畫結束時被調用。

我已經使用了animationEnd事件，以便我可以觸發上述功能，但正如我所說的，我只想讓它在最後一個動畫上運行。

有沒有一種方法來檢測動畫已結束通過檢查動畫的名稱已觸發animationEnd事件？

因此允許我使用if語句來選出最後一個動畫。

Answer 1

當您定義函數時，該參數是必需的。其中任何一個都可以工作;

var $element = $('.eye').bind("webkitAnimationEnd oAnimationEnd msAnimationEnd animationend", function(event){ 
    if (event.originalEvent.animationName === "three") { 
     console.log('the event happened'); 
    } 
} 

或者，

var $element = $('.eye').bind("webkitAnimationEnd oAnimationEnd msAnimationEnd animationend", function(e){ 
    if (e.originalEvent.animationName === "three") { 
     console.log('the event happened'); 
    } 
} 

Answer 2

我不知道爲什麼...但我只能通過e.originalEvent.animationName

趕上了animationName所以最好的選擇是：

function getAnimationName(e) { 
    if(e.animationName != undefined) return e.animationName; 
    if(e.originalEvent.animationName != undefined) return e.originalEvent.animationName; 
    else return undefined; 
}