獲取一個按鈕來觸發兩個事件

Question

我對JavaScript很新，我需要一些幫助。我正在使用GreenSock庫來動畫svg對象，並且遇到問題。我已經設置了，如果你點擊一個按鈕，動畫會播放出來，但我想以一種方式設置它，如果我再次單擊該按鈕，它會反轉動畫。你們有什麼想法如何做到這一點？我嘗試過使用事件監聽器，但那對我不起作用。也許我做錯了什麼。請幫忙。謝謝！！

Answer 1

這樣的事情可能嗎？

var bool= true; 

    function toggle(){ 
     if (bool){ 
      // script for animation 1 
      bool = false; 
     } else { 
      // script for animation 2 
      bool = true 
     } 
    } 

隨意問我是不是不夠明確

Answer 2

有一個布爾開關，每個按鈕被點擊一次翻轉，並根據布爾值觸發不同的動畫。

例如，

var bool = false; 
function onClickAnimation() { 
    if(!bool) { 
    bool = true; 
    //play the animation 
    } else { 
    bool = false; 
    //reverse the animation 
    } 
} 

Answer 3

下面是一個例子。你可以切換出你希望來回切換的任何CSS的height屬性。這被稱爲事件委託人。只有一個事件監聽器根據條件語句執行不同的功能。

https://jsfiddle.net/mqmf12hy/

var resizeButton = document.getElementById('resizeButton'); 
resizeButton.addEventListener('click', function() { 
    var happyFace = document.getElementById('happyFace'); 
    // If the image is small, make it big 
    if (happyFace.style.height == '56px') { 
    $(happyFace).animate({ 
     height: '72px' 
    }, 1000); 
    } 
    // If the image is big, make it small 
    else if (happyFace.style.height == '72px') { 
    $(happyFace).animate({ 
     height: '56px' 
    }, 1000); 
    } 
});