sábado, 25 de julio de 2015

Ejecutar función de Javascript cada cierto tiempo por cierto tiempo

Esta vez necesitaba programar el  autoguardado  de una página  y me metí con los 3 eventos del tiempo de javascript. Investigando  y cometiendo muchos errores dí  finalmente con  esta página
https://www.pedroventura.com/javascript/funciones-javascript-setinterval-clearinterval-settimeout-2/
Donde nos  explican los 3 eventos

FUNCIONES JAVASCRIPT – SETINTERVAL() CLEARINTERVAL() SETTIMEOUT() – 2

Mi código  quedó así
Solamente para javascript,  este es un evento  invocado  desde servidor

 var repeticion;
    function ParpadeoGuardadoAutomatico() {
        repeticion = window.setInterval("Parpadeo()", 500);
        window.setTimeout("clearTimeout(repeticion);", 4100);
    }

    function Parpadeo() {
        if ((document.getElementById('imgAutoGuardado').style.display == 'block'))
            document.getElementById('imgAutoGuardado').style.display = 'none';
        else
            document.getElementById('imgAutoGuardado').style.display = 'block';
    }


Lo que hace es cada vez que mi Timer  se activa hace sus procesos en el servidor y llama al evento 
ParpadeoGuardadoAutomatico();
Este evento  crea la variable repetición que dice que se ejecute el  cambio  de visibilidad de la imagen cada medio  segundo, esto  sucedería infinitamente si no  destruyera la variable con clearTimeout(repeticion);, pero  además le tuve que indicar en que momento  se va a  detener el parpadeo  y le puse a los 4 segundos,  apenas aparece y desaparece 4 veces.


Para los que no saben que es el  Timer de asp,net
<div style='text-align:right; position:absolute; right:0px; top:0px;'>
    <img id="imgAutoGuardado" style="display:block;" src="../../Imagenes/Iconos/AutoGuardado.fw.png" />
        <asp:UpdatePanel ID="UpdatePanel16" runat="server">
        <ContentTemplate>
        <asp:Timer ID="TimerAutoGuardado" Interval="10000" runat="server" ontick="TimerAutoGuardado_Tick"></asp:Timer>
        <asp:HiddenField ID="HiddenContadorGuardado"  Value="0" Visible="true" runat="server" />
        </ContentTemplate>
        <Triggers>
        <asp:AsyncPostBackTrigger ControlID="TimerAutoGuardado" EventName="Tick" />
        </Triggers>
        </asp:UpdatePanel>
    </div>






1 comentario:

  1. Muy interesante, me sirvió bastante con un sistema de hospital que cargo ahorita.
    Gracias.

    ResponderBorrar