Estoy haciendo un juego de memoria. Ya funciona, pero cuando elijo dos tarjetas que no tienen la misma imagen, retroceden instantáneamente, sin mostrar al usuario lo que hay en la segunda tarjeta. Creo que debería usar setTimeout(), pero por ahora solo hizo que mi función flipBack() no funcionara en absoluto. Tal vez, lo estoy usando incorrectamente o en el lugar equivocado.
Intenté poner flipBack() y setTimeout(flipBack, 5000) dentro de "else if", fuera de él, fuera de mi función de revelación de tarjeta().
Solo obtengo "Error de tipo no capturado: no se pueden leer las propiedades de undefined (leyendo 'estilo') en flipBack (juego de memoria.js: 61:35)" en la consola. Parece que setTimeout no puede ejecutar flipBack() o algo así.
let board = document.getElementById("board"); let score = document.getElementById("score"); let fails = document.getElementById("fails"); let cards = document.querySelectorAll(".card"); // add eventListener to every card for (let i = 0; i < 6; i++) { cards[i].addEventListener("click", revealCard); } let revealCounter = 2; let imgAltArray = []; let latestTwoRevealedCards = []; let points = 0; let wrongGuesses = 0; function revealCard(event) { if (revealCounter > 0) { let cardImg = event.target.firstChild; // make card "flip", so you can see the picture cardImg.style.visibility = "visible"; imgAltArray.push(cardImg.alt); latestTwoRevealedCards.push(cardImg); console.log(imgAltArray); revealCounter--; // check if both cards have the same picture on them by comparing alt parameters if (revealCounter == 0 && imgAltArray[0] === imgAltArray[1]) { imgAltArray = []; latestTwoRevealedCards = []; points++ score.textContent = `Score: ${points}`; revealCounter = 2; } else if (revealCounter == 0 && imgAltArray[0] !== imgAltArray[1]) { wrongGuesses++; fails.textContent = `Failed attempts: ${wrongGuesses}` imgAltArray = []; // make cards flip back setTimeout(flipBack, 5000); latestTwoRevealedCards = []; revealCounter = 2; } } } // TIMEOUT DOESN"T WORK function flipBack() { for (let i = 1; i >= 0; i--) { latestTwoRevealedCards[i].style.visibility = "hidden"; } }latestTwoRevealedCards[i] Este elemento puede no estar undefined