Tengo un código que ejecuta setInterval en una función. Lo que trato de lograr es salir de esa función después de que ocurrió clearInterval. Configuré una condición para comprobar si se borra el intervalo. Estoy luchando por encontrar un método para regresar desde la función principal Start() según el estado actual del código.
Código:
function Start() { var elementX = document.getElementById('moveMeX') var elementY = document.getElementById('moveMeY') elementY.style.top = "0px" var posX = 0 startPosX = 0 var posY = 0 startPosY = 0 var speed = 1 var xIsMoving = true var yIsMoving = true var myIntervalX = setInterval(function() { if(startPosX == 0) { posX+=speed elementX.style.left = posX + 'px' if(posX==100) { startPosX = 100 } } else if (startPosX==100) { posX-=speed elementX.style.left = posX + 'px' if(posX==0) { startPosX = 0 } } }, 10); function stopX() { clearInterval(myIntervalX); xIsMoving = false } elementX.addEventListener("mousedown", stopX); elementX.addEventListener("mousedown", startY); function startY() { var myIntervalY = setInterval(function() { if(startPosY == 0) { posY+=speed elementY.style.top = posY + 'px' if(posY==100) { startPosY = 100 } } else if (startPosY==100) { posY-=speed elementY.style.top = posY + 'px' if(posY==0) { startPosY = 0 } } }, 10); function stopY() { elementY.style.zIndex = "-1"; clearInterval(myIntervalY); yIsMoving = false } elementY.addEventListener("mousedown", stopY); } if (xIsMoving === false && yIsMoving === false) { console.log('stopped') stopped = true } } Start()Enlace de código abierto: https://codepen.io/silentstorm902/pen/podNxVy
La parte con la que dices que tienes un problema,
if (xIsMoving === false && yIsMoving === false) { console.log('stopped') stopped = true }actualmente solo se ejecuta una vez: cuando se llama a Start() por primera vez. En ese momento, ambas condiciones son falsas porque las variables tienen sus valores iniciales declarados verdaderos .
Podría crear un nuevo setInterval para ejecutar esta declaración if de vez en cuando, pero parece innecesario porque su función stopY actual es realmente el lugar donde sabe que tanto xIsMoving como yIsMoving son falsos, porque stopY solo se ejecuta después de que stopX se haya ejecutado. Así que simplemente mueva su declaración de stopped=true al final de la función stopY:
function stopY() { elementY.style.zIndex = "-1"; clearInterval(myIntervalY); yIsMoving = false; console.log("stopped"); stopped = true; }