0

estoy realizando un proyecto en el que tengo un tablero y sobre este una ficha que se va moviendo según un numero aleatorio que se genera al pulsar sobre un dado. El código me funciona bien, el problema es que cada vez que muevo la ficha y, por ejemplo, digamos que se mueve desde la casilla numero UNO a la numero CUATRO, la casilla aparece automáticamente en la numero CUATRO, sin ver visualmente como pasa por la DOS y la TRES, no se como aplicar un setTimeout o un setInterval a mi código, estoy un poco verde en eso aun, ¿alguna ayuda? Muchas gracias.

  function MoverPulsado(name) {
  const fichas = document.getElementsByClassName("ficha");
  for (var i = 0; i < fichas.length; i++) {
    let casillaConF = fichas[i].parentNode;
    if (fichas[i].id === name) {
      if (casillaConF.nextElementSibling) {
        casillaConF.nextElementSibling.appendChild(fichas[i]);
        cantParaMover -= 1;
        casillaConF = fichas[i].parentNode;
        if (casillaConF.className == "casilla fin") {
          alert("Has ganado");
        }
        if (cantParaMover > 0) {
          MoverPulsado(name);
        } else {
          verificarCasilla(casillaConF, name);
        }
        break;
      }
      if (!casillaConF.nextElementSibling) {
        casillaConF = casillaConF.parentNode;
        if (casillaConF.nextElementSibling) {
          //casillaConF es filaX
          casillaConF = casillaConF.nextElementSibling;
          if (casillaConF.children.length > 0) {
            casillaConF = casillaConF.firstChild;
            setTimeout(3000);
            casillaConF.nextElementSibling.appendChild(fichas[i]);
            cantParaMover -= 1;
            if (cantParaMover > 0) {
              MoverPulsado(name);
            } else {
              verificarCasilla(casillaConF);
            }

            break;
          }
        }
      }
    }
  }

  pulsado = 0;
}

1 respuesta 1

0

Que te parece si usas async await , de esa manera podrias comprobar que se mueva primero a una casilla para depues mover a la siguiente,tambien deberias separar en varias funciones más pequeñas, respondiendo a tu pregunta deberias aplicar setTimeOut y funciona de la siguiente manera:

```setTimeout(() => {
      //AQUI DEBES COLOCAR LA LOGICA
    }, //AQUI EN EL TIEMPO DESPUES DEL QUE SE EJECUTARA);```

las diferencias entre setTimeout y setInterval es que la primera se ejecutara una sola vez despues del tiempo que establezcas,en cambio setInterval ejecutara el codigo cada que pase el tiempo que tu le establezcas osea se repetira

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.