Lenguajes
Web/Otros
Extra
Enlaces

Las funciones setInterval y setTimeout en JavaScript

Estas dos funciones permiten ejecutar una función pasado un cierto intervalo de tiempo. La única diferencia entre ellas es que "setInterval" se ejecutará una y otra vez en intervalos de x segundos, en cambio, setTimeout se ejecutará una sola vez pasados x segundos.

Estas funciones se utilizan sobre todo para realizar animaciones o por ejemplo para redireccionar una página transcurridos x segundos.

Por ejemplo, si quisiéramos programar un reloj en la barra de estado la función más idónea sería setInterval. Teniendo una función llamada "reloj()" que imprime en la barra de estado la hora actual utilizaríamos la función setInterval de esta forma:

	setInterval("reloj()",1000);

El primer parámetro es la función a ejecutar, el segundo es el intervalo en milisegundos, es decir, 1000 milisegundos = 1 segundo. De esta forma, cada segundo se ejecutará la función "reloj()" y por lo tanto se mostrará un reloj con la hora actual que irá cambiando segundo a segundo. La función reloj() podría ser esta:

function reloj() {

var fObj = new Date() ;

var horas = fObj.getHours() ;

var minutos = fObj.getMinutes() ;

var segundos = fObj.getSeconds() ;

if (horas <= 9) horas = "0" + horas;

if (minutos <= 9) minutos = "0" + minutos;

if (segundos <= 9) segundos = "0" + segundos;

window.status = horas+":"+minutos+":"+segundos;

}

La otra función, setTimeout, tiene un uso muy similar, pero como ya hemos dicho, sólo se ejecuta una vez y podemos aprovechar esta característica para redireccionar una página. Por ejemplo:

	setTimeout("document.location.href='http://www.google.es';",5000);

Con este código en 5s el usuario sería redireccionado a Google.

Además estas funciones devuelven un identificador que nos permitirán neutralizarlas con sus respectivas funciones clearTimeout y clearInterval. Es decir:

	var id = setInterval("reloj()",1000);

setTimeout("clearInterval("+id+")",15000);

Con este ejemplo ejecutamos nuestro reloj durante 15 segundos.

En definitiva, sencillas funciones que llegan a resultar muy útiles.


Redactado por Nenillo

Inicio | JavaScript necesario para este enlace

Noticias en RSS2 XHTML Vlido CSS Vlido