animationend запускает все ранее запущенные функции каждый раз

Question

У меня есть базовая пошаговая битва, в которой вы создаете атаку с помощью ввода from, ability, targ, и все это прекрасно работает, но урон наносится в конце короткой анимации персонажа с использованием jquery и on(animationEnd, I ' Мы прошли отладчик, и код работает, как и ожидалось, но во второй раз, когда я атакую ​​тем же символом, он выполняет все предыдущие атаки, которые я запускал, исходя из его animationEnd, он запускает 1-ю атаку, затем 2-ю и так далее. мои входные данные определенно свежие, и я очищаю все предыдущие входные данные, просто кажется, что они сохраняют предыдущие функции в on(animationEnd где-то и запускают их снова, есть известная причина для этого? и есть ли способ заставить его забыть все ранее запущенные функции, которые приходят из целей on(animationEnd? Я почти уверен, что мне просто нужен способ отсоединить ранее использовавшиеся функции от цели animationEnd, или в худшем случае использовать обходной путь timeOut вместо animationEnd, но вот как работает мой код, если его нет

var targ=($(this).attr('id'));   //the character u click on for who to attack   
var from = optArray[0];   //all from previous inputs
var ability= optArray[2];
createAtt(from, ability, targ);
runAtt();       

выше приведен порядок выполнения после того, как пользователь вводит информацию, затем он создает атаку, затем запускает ее, затем ниже приведены функции, в которые они переходят

var attackQue=[];
var currentAtt;

var createAtt=function(from, ability, targ){   //pushes an array of 3 into a a parent array to que attacks
    var x=[from, ability, targ];
    attackQue.push(x);  
};

function runAtt(){     
    if (attackQue.length===0) {    //checks if there is attacks to be run from attQue
        console.log('no attacks to run');
    }
    else if (!currentAtt) {    //if theres attacks in que but nothing running
        currentAtt=attackQue[0];            
        abilities[currentAtt[1]].func(currentAtt[0], currentAtt[2]);   //this refers to the attacks object and its child function with relevent data
    }
    else{    //if theres attacks that in current attack that are being ran
        console.log("already attacking");
    }   
}

и проблема возникает в конце анимации в функции способности, которая примерно выглядит следующим образом

var abilities={
    slash:{
        base: 100,
        crit: true,
        genus: "phys",      
        cast: false,                
        func:function(from, targ){          
            $("#"+from+">div.charDiv>img").removeClass().addClass("slash");   //this is the animation that will run once that then triggers the animationEnd
            $("#"+from+">div.charDiv>img").on('webkitAnimationEnd oanimationend msAnimationEnd animationend', function(){

   //what ever is run below here will run will run every time
                abilities.damage(from, "slash", targ);              
                turnOver(from);   //clears inputs from attackQue and currentAtt
            });                     
        }           
    } 
}

так что в следующий раз, когда я запустил способность от того же человека, даже с другой способностью, предыдущий слеш будет запущен снова 1-й, а затем новая способность, скажем, я г-н Х слешит г-на Y после запуска его слеш-анимации, в следующий раз г-н Х атакует, он iceBarrages г-н Z, после окончания анимации г-н X коснется г-на Y, а затем iceBarrage г-н Z. on(animationEnd г-н X добавляет функции в список выполнения

здесь также есть функция turnOver, которая очищает все входы и определяет, есть ли другая возможность для запуска

function turnOver(from){
    currentAtt=false;  //clears currentAttack and turns false for runattack() line 5
    attackQue.shift();   //removes attack from the que so next attack can be run
    loaders(from);   
    bounce(from);   //changes from the attack animation to the endless bounce animation for idle chars
    runAtt();   //runs to check if there is another attack qued
}