0

intento ser breve, estoy creando un minijuego con JS, y estoy haciendo una especie de menú de dificultad, donde en mi función dificultad() dependiendo del botón donde pulse el usuario, la función devolverá mediante un return los valores Fácil = 3000; Difícil = 1000; God = 100; Luego con esos valores que devuelve la función, mi idea es meterlo como segundo parámetro en la función setInterval(), ya sabéis que esta función tiene 2 parámetros, el primero es una función que quieres que se repita, y el segundo parámetro es la velocidad a la que quieres que se repita. Pues mi idea es esa, que como segundo parámetro tome una función que vaya a devolver un número dependiendo de la opción del usuario elegida.

El problema, no me está funcionando, (en realidad creo saber que pasa pero no sé arreglarlo), creo que si por ejemplo la función dificultad devuelve 3000, y pongo esa función en el interval, me está metiendo en bucle o una cosa rara el 3000 y está ejecutando muchísimas veces el setInterval().

El juego básicamente es una tabla, donde el protagonista se mueve por ella, y el malo intenta atraparte, el objetivo es coger un objeto en la tabla y escapar por una salida. El setInterval() es para controlar la velocidad a la que se mueve el malo simplemente.

Os pongo el código en cuestión a ver si podemos solucionarlo, gracias de antemano.

timer = setInterval("atrapar()", "dificultad()");

function dificultad() {
//Primero creo las opciones de dificultad que serán botones (fácil dificil god)
var opciones;
for (let i = 0; i<3;i++){
    opciones=document.createElement("input");
    opciones.type="button";
    
    document.body.appendChild(opciones);
}
var arrayOpciones = document.querySelectorAll("input[type='button']");
//Deshabilito el botón de dificultad para que no pueda volver a ser clickado
arrayOpciones[2].disabled=true;

arrayOpciones[3].value="Fasil";
arrayOpciones[4].value="Dificil"
arrayOpciones[5].value="God";

arrayOpciones[3].addEventListener("click",()=>{
    //alert ("Has dado click en Fasil");
    
    
    return 2000;
})
arrayOpciones[4].addEventListener("click",()=>{
    //alert ("Has dado click en Dificil");
   
    return 10000;

});
arrayOpciones[5].addEventListener("click",()=>{
    //alert ("Has dado click en God");
    
    return 100000000;
});
console.log(arrayOpciones[5].value);

}

Aclarar que la función dificultad() será llamada cuando el usuario haga click en el botón de Dificultad, lo tengo así planteado en el HTML

<input type="button" value="Dificultad" onclick="dificultad()">

Los Alert funcionan, y he probado varios console log y consigo sacar el número sin problemas, el fallo está en no saberlo implementar en el setInterval() Por cierto, el segundo parámetro que veis que lo tengo entre comillas dobles "" era porque estaba probando a ver si era fallo de eso, las comillas no son necesarias.

Un saludo.

2
  • te ahorras codigo pasandole al callback de addEventListener("click",(e)=> y luego haciendo let self = e.target el evento retorna especificamente a quien se le dio click entonces si haces e.target.value tendras el valor del boton que le diste click ahora solo seria un hace unos if() para validar que dificultad...
    – Bryro
    el 6 feb. 2022 a las 21:15
  • Lo acabo de solucionar creando variables globales, es un poco chapuzas pero ha colado y va de lujo jaja el 6 feb. 2022 a las 21:23

1 respuesta 1

0

puedes hacerlo asi:

function dificultad() {
// seleccionamos al padre
let buttons = document.querySelector("div");
let dificultades = {"facil": 3000,"dificil" : 1000  , "god" : 100};
buttons.addEventListener("click",(e)=>{
  // del evento tomamos el target
  let self = e.target;
  // validamos que sea un elemento typo input
  if( e.target.nodeName == "INPUT"){
     // pasamos el valor a minuscula 
     let val = self.value.toLowerCase();
     // validamos que exista esa llave en nuestro diccionario
     if(dificultades[self.value.toLowerCase()]){
           // pasamos la llave ej. "facil" cuyo valor es 3000
           let puntos =  dificultades[self.value.toLowerCase()];
          // hacemos un alert
           alert(`le diste click a ${val} con valor ${puntos}`);
          // limpiamos el intervalo                                              
          //clearInterval(timer);
          // volvemos a cargar interval
          //timer = setInterval( function, puntos);
        }
  }
});

}

dificultad()
<div>
<input type="button" value="facil">
<input type="button" value="intermedio">
<input type="button" value="dificil">
<input type="button" value="god">
</div>

1
  • Está genial, lo hice de otra forma al final, pero sirve. Gracias ^^ el 7 feb. 2022 a las 0:51

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.