1

Quiero crear un evento sobre el objeto Window que al soltar una tecla en este caso enter me incremente un contador, en caso de que ese contador llegue a 10 se elimina ese evento. El problema es que funciona bien, al llegar al 10 deja de contar, pero sigue registrandome la tecla enter pero ahora lanzandome el error : "Uncaught RangeError: Maximum call stack size exceeded" y dentro del elemento "boton2" (uso textContent para mostrar el contador en un div) me tira unos numeros extraños

const boton2 = document.querySelector(".boton2")
    
    let contador2 = 0
    let funcion2 = function(event){
        if(event.key=="Enter") contador2++;
        boton2.textContent = `${contador2}`
        if(contador2>10) removeEventListener("keyup",funcion2(event));
    }
    
    addEventListener("keyup",event => funcion2(event)) 

he probado muchas cosas pero estoy a ciegas, simplemente no se que esta ocurriendo. Si alguien sabe y me lo explica se lo agradeceria.

1 respuesta 1

3

Veo dos problemas. Cuando añades el event listener, lo hace así

addEventListener("keyup",event => funcion2(event))

Esto en realidad crea una función flecha, que es la que realmente estás registrando y luego esta llama a función2

Por otro lado, cuando eliminas el event listener, lo haces de esta manera

removeEventListener("keyup",funcion2(event));

Pretendes eliminar la escucha capturada por funcion2, pero como dije arriba, lo que registraste no es funcion2 sino la función flecha. Por otro lado, tampoco estarías "des-registrando" la funcion2, sino lo que devuelve la funcion2, ya que al poner los paréntesis, lo que realmente estás haciendo es llamarla y pasándole a removeEventListener el valor devuelto.

Para solucionarlo, cambia el addEventListener por

addEventListener("keyup", funcion2)

Como ves, ahora estamos registrando la función. De igual manera, al eliminarla, cambia el removeEventListener por

removeEventListener("keyup",funcion2);

Y una última cosa, aunque no tiene nada que ver con lo anterior, si pretendes contar hasta 10, la comparación debería decir así

if(contador2 >= 10)

o bien

if(contador2 > 9)

ya que en caso contrario, al hacerse la comparación después de mostrar el dato, contaría hasta 11.

1
  • Gracias por tu respuesta! igual era una tonteria :( el div que muestra el contador antes era un input y me olvide de sacarle la propiedad type="button", se lo saque y ya me funciona bien no tuve que cambiar nada, gracias igual el 7 ago. 2022 a las 21:16

Tu Respuesta

Al pulsar en “Publica tu respuesta”, muestras tu consentimiento a nuestros términos de servicio, política de privacidad y política de cookies

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