爲什麼我的動畫卡在循環中？

Question

我看到一些奇怪的行爲與我的CSS動畫，並希望有人可以幫忙。我基本上使用選擇框來選擇應該顯示哪個<ul>。但是，如果用戶選擇價值A，選擇B值，然後選擇再次，動畫被扔進一個無限循環A和B.

$('select#month').change(function(){ 
    var s = $('option:selected', this).val(); 

    $('#plan-wrapper ul.visible').addClass('scaleFadeOut').on('animationend', function(){ 
     $(this).removeClass('scaleFadeOut visible').addClass('hidden'); 

     $('#plan-wrapper ul#' + s).removeClass('hidden').addClass('scaleFadeIn').on('animationend', function(){ 
     $(this).removeClass('scaleFadeIn').addClass('visible'); 
     }); 

    }); 
    }); 

之間褪色我目前沒有這個網上的任何地方，但我很快就會建立一個臨時站點。如果需要，我會用鏈接更新這篇文章。

編輯：作爲承諾，這裏是一個臨時網站鏈接：https://lbc.labs.nichols-co.com/vision

我現在可以停止越來越downvotes？

Answer 1

非常感謝/ u/SirHound on reddit。他指出，我需要致電off()刪除事件偵聽器。 Here is a link to his answer.