0 votos

Hacer que se ejecute una sola vez

Como hago que este codigo se ejecute una sola vez sin que se vuelva a repetir, me refiero que solo llegue a 100 al hacer el scroll y que no avance mas.

 window.addEventListener("scroll", nombredelafuncion);

  function nombredelafuncion(e) {
  e.target.removeEventListener(e.type, nombredelafuncion);

  if(window.pageYOffset >= 200){
   interval = setInterval(function()
  {
     document.getElementById('numeros').textContent = numero++;
       if(numero > 100){
         clearInterval(interval);
       }
   }, 50);
 }
 }

2voto

Ivan Muñoz Puntos 1120

Buen dia,

El error esta en que e.target no apunta a window, en este caso apunta a document, e.view si apunta a window

Esta seria la funcion correcta:

window.addEventListener("scroll", nombredelafuncion);

    function nombredelafuncion(e) {
        e.view.removeEventListener(e.type, nombredelafuncion);
        //Nose en que parte de tu codigo declaras la variable numero asique yo la declare aca
        var numero = 0;
        if(window.pageYOffset >= 200){
            interval = setInterval(function() {
                document.getElementById('numeros').textContent = numero++;
                if(numero > 100){
                    clearInterval(interval);
                }
            }, 50); 
        } 
    }

Ah y otra cosa asi como esta el script sera muy dificil que se ejecute, pero talvez es lo que quieres, si no es asi deberias usar este script:

window.addEventListener("scroll", nombredelafuncion);

function nombredelafuncion(e) {
    //Nose en que parte de tu codigo declaras la variable numero asique yo la declare aca
    var numero = 0;
    if(window.pageYOffset >= 200){
        e.view.removeEventListener(e.type, nombredelafuncion);
        interval = setInterval(function() {
            document.getElementById('numeros').textContent = numero++;
            if(numero > 100){
                clearInterval(interval);
            }
        }, 50); 
    } 
}

Como veras aqui meto e.view.removeEventListener(e.type, nombredelafuncion); dentro del condicional, lo que seria un poco mas logico

Correccion:

Aqui te dejo un link de fiddle para que lo veas en accion y veas que si funciona

https://jsfiddle.net/xd1zj271/

Segunda correccion:

De la siguiente forma funciona tambien en Google Chrome:

window.addEventListener("scroll", nombredelafuncion);

function nombredelafuncion(e) {
    //Nose en que parte de tu codigo declaras la variable numero asique yo la declare aca
    var numero = 0;
    if(window.pageYOffset >= 200){
        window.removeEventListener(e.type, nombredelafuncion);
        interval = setInterval(function() {
            document.getElementById('numeros').textContent = numero++;
            if(numero > 100){
                clearInterval(interval);
            }
        }, 50); 
    } 
}

0 votos

Me di cuenta que el codigo me funciona en otros navegadores menos el de chrome no se porque y este es el error que me sale en chrome Uncaught TypeError: Cannot read property 'removeEventListener' of undefined

0 votos

ahi te agrege la correccion para que funcione en Google Chrome

0voto

alain barrios Puntos 90

Bien la verdad no me resulta el codigo no se si me entiedes lo que quiero lograr es esto que sale en este sitio en la sección de Resultados salen unos numeros que aumentan hasta un limite y se detienen y no vuelven a ejecutarse mas. http://www.latamdigitalmarketing.com/

0 votos

Mira la correccion en mi pregunta, ahi te dejo un link

Iteramos.com

Iteramos es una comunidad de desarrolladores que busca expandir el conocimiento de la programación mas allá del inglés.
Tenemos una gran cantidad de contenido, y también puedes hacer tus propias preguntas o resolver las de los demás.

Powered by: