0

Tengo un problema con un ejercicio que estoy desarrollando , la idea es que cambie de color uno de los imputs tras un numero generado aleatoriamente con la funcion anterior, el problema es que cuando se lanza el setInterval me devuelve el siguiente error : Uncaught ReferenceError: brown is not defined alguien podria ayudarme para saber que estoy haciendo mal , gracias

`<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title><strong>Whack a Mole</strong></title>
  <h1>
    <p><strong>Whack a Mole</strong></p>
  </h1>
  <div><input type="hole_0" name="" class="hole"></div>
  <div><input type="hole_1" name="" class="hole"></div>
  <div><input type="hole_2" name="" class="hole"></div>
  <div><input type="hole_3" name="" class="hole"></div>
  <div><input type="hole_4" name="" class="hole"></div>
  <div><input type="hole_5" name="" class="hole"></div>
</head>

<body>
  <script>




    
    var aleatorio = () => { return Math.round(Math.random() * div.length )}
    
    var div = document.getElementsByClassName('hole');
    


   

    setInterval(div[aleatorio()].style.backgroundColor ="brown",1000) ;
        
      

    
    

    
</script>
</body>

</html>`
1
  • setInterval=()=>div[aleatorio()].style.backgroundColor ="brown",1000 ; asi no devuelve nada y con {} tampoco , lo del math fue un fallo al copiarlo el 1 may. 2022 a las 22:36

2 respuestas 2

1

La función setInterval recibe un callback (una función) como primer argumento. Por favor, cambia div[aleatorio()].style.backgroundColor ="brown" por:

() => div[aleatorio()].style.backgroundColor ="brown". 

Te adjunto tu código corregido:

<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title><strong>Whack a Mole</strong></title>
  <h1>
    <p><strong>Whack a Mole</strong></p>
  </h1>
  <div><input type="hole_0" name="" class="hole"></div>
  <div><input type="hole_1" name="" class="hole"></div>
  <div><input type="hole_2" name="" class="hole"></div>
  <div><input type="hole_3" name="" class="hole"></div>
  <div><input type="hole_4" name="" class="hole"></div>
  <div><input type="hole_5" name="" class="hole"></div>
</head>

<body>
  <script> 
    var aleatorio = () => { return Math.round(Math.random() * div.length )}
    
    var div = document.getElementsByClassName('hole');
   
    setInterval(() => div[aleatorio()].style.backgroundColor ="brown",1000) ;
        
</script>
</body>
</html>

1
  • disculpa , me comi un parentesis , llevo muy pocas horas de java y todo el dia con esto , muchisimas gracias el 1 may. 2022 a las 22:47
-1
introducir el código aquí
    var aleatorio = () => { return Math.round(Math.random() * div.length )}

    var div = document.getElementsByClassName('hole');

    setInterval(div[aleatorio()].style.backgroundColor("brown"), 1000) ;
    
  

así como accedes a los input por sus clases así mismo asignas valores

Tu Respuesta

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

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