Tengo un problema con mi código y es que el addEventListener no funciona al hacer click en una de las partes del círculo. Alguien me podr...

Pregunta de la clase:
Obteniendo el input del usuario
Rubén Dario

Rubén Dario

Pregunta
student
hace 6 años

Tengo un problema con mi código y es que el addEventListener no funciona al hacer click en una de las partes del círculo. Alguien me podría explica a que se deba? Investigué un poco sobre la razón y me dijieron que es porque hay un valor nulo…

const celeste = document.getElementById('celeste'); const violeta = document.getElementById('violeta'); const naranja = document.getElementById('naranja'); const verde = document.getElementById('verde'); const btnEmpezar = document.getElementById('botoncito'); class Juego { constructor() { this.inicializar(); this.generarSecuencia(); this.siguienteNivel(); } inicializar() { btnEmpezar.classList.add('hide'); this.level = 1; this.colores = { celeste, violeta, naranja, verde, } } generarSecuencia() { this.secuencia = new Array(10).fill(0).map(n => Math.floor(Math.random() * 4)); } siguienteNivel() { this.iluminarSecuencia(); } transformarNumeroAColor(numero) { switch (numero) { case 0: return 'celeste'; case 1: return 'violeta'; case 2: return 'naranja'; case 3: return 'verde'; } } iluminarSecuencia(){ for (let i = 0; i < this.level; i++) { let color = this.transformarNumeroAColor(this.secuencia[i]); setTimeout(() => { this.iluminarColor(color) }, 1000 * i); } } iluminarColor(color){ this.colores[color].classList.add('light'); setTimeout(() => this.apagarColor(color), 350); } apagarColor(color){ this.colores[color].classList.remove('light'); } agregarEventosClick() { this.colores.celeste.addEventListener("click", this.elegirColor,false) this.colores.violeta.addEventListener("click", this.elegirColor,false) this.colores.naranja.addEventListener("click", this.elegirColor,false) this.colores.verde.addEventListener("click", this.elegirColor,false) } elegirColor(ev) { alert('hola') } } const empezarJuego = () => window.juego = new Juego();
2 respuestas
    Aldo Said Salas Rodríguez

    Aldo Said Salas Rodríguez

    student
    hace 6 años

    Prueba poniendo click en comillas simples.

    'click'
    Deivi Alfredo Arocutipa Serrano

    Deivi Alfredo Arocutipa Serrano

    student
    hace 6 años

    no te funciona por que no inicializas en ningun lugar el evento siguienteNivel() { this.iluminarSecuencia() this.agregarEventosClick() }

Fundamentos de JavaScript 2018

Fundamentos de JavaScript 2018

JavaScript es un lenguaje de programación que se trabaja desde el navegador. Construye programas, conoce el entorno, los condicionales y las estructuras repetitivas. Aprende cuáles son y cómo se declaran las variables y las funciones de JS.

Fundamentos de JavaScript 2018
Fundamentos de JavaScript 2018

Fundamentos de JavaScript 2018

JavaScript es un lenguaje de programación que se trabaja desde el navegador. Construye programas, conoce el entorno, los condicionales y las estructuras repetitivas. Aprende cuáles son y cómo se declaran las variables y las funciones de JS.