Funciones Definidas Control del Tiempo en JavaScript
También tenemos funciones ya definidas por el propio lenguaje javascript, es decir, que hacen algo y siempre lo mismo, que nos pueden ser muy útiles en nuestros programas. Normalmente van dentro de otra función. Veamos alguna.
La función "setTimeout" se ejecutará (o "llamará a una función) una sola vez pasados x segundos.
setTimeout("nombreFuncion()",tiempo en milisegundos);
Un ejemplo:
setTimeout("reloj()",1000);
Aquí la función reloj se llamará ejecutándose pasados 1000 milisegundos (1 segundo) desde que el programa lee el setTimeout.
setTimeout("mostrarAviso()",3000);
function mostrarAviso(){
alert("Han pasado los tres segundos");
}
A los 3 segundos llamará a la función mostrarAviso, es decir a los 3 segundos saldrá un mensaje que nos dirá que pasaron 3 segundos.
Podemos poner en lugar de llamar a una función, llamar a una variable.
Esta instrucción window.open("direccion URL"); sirve para llevarte a una página web (¿Lo recuerdas?). Intenta crear un aviso que salga tras un segundo y, al hacer click en aceptar, nos lleve a una página web determinada.
(Solución)
setTimeout("iraweb()",1000);
function iraweb(){
alert("Ha pasado 1 segundo, te llevamos a la web");
window.open("http://www.marca.com");
}
Cuando pasa 1 segundo sale un aviso y al pulsar aceptar se abre una ventana nueva hacia la web especificada. Fíjate que el nombre de la función va entre comillas.
La función setInterval
La función setInterval sirve para especificar cada cuánto tiempo tiene que "llamarse" a una función, pero se llamará una y otra vez cada tiempo especificado, es decir, se repite la llamada cada x tiempo.
Imagina que queremos que se repita lo que hay dentro de una función cada 1000 milisegundos. Ojo: estará repitiéndose continuamente hasta que no especifiquemos que se pare.
setInterval("nombreFuncion()",1000);
En este caso nombreFuncion se repetiría cada 1000 milisegundos (1 segundo). El segundo parámetro (argumento) es el tiempo en milisegundos.
¿Qué hace el siguiente programa?
setInterval("repetir()",1000);
function repetir () {
alert ("Ha pasado 1 segundo")
}
Siii, sale un mensaje cada segundo. Pero cada segundo vuelve a salir el mismo mensaje. Imagina que queremos que se pare el mensaje a los 3 segundos.
Con clearInterval(nombreVariable); detendremos o pararemos la función que está en marcha con setInterval. Fíjate que entre paréntesis va el nombre de una variable, por eso es necesario asignar el setInterval a una variable, para luego pararlo con clearInterval.
Vamos a programar un botón en la página web, que nos permita pulsarlo para activar clearInterval, es decir que pare de repetir el mensaje solo cuando pulsemos el botón.
Para ello abre el archivo web.html y escribe dentro del <body> (cuerpo):
<input type="button" value="Parar el Mensaje" name="botonParar" onclick="clearInterval(bucleRepetir)" />
En el javascript escribe:
var bucleRepetir = setInterval("repetir()",1000);
function repetir () {
alert ("Ha pasado 1 segundo");
}
¡Ahora sí! Se repite la alerta cada segundo, pero si queremos parar que salga la alerta solo tendremos que pulsar el botón creado.
Tutorial de JavaScript (XIV)
También tenemos funciones ya definidas por el propio lenguaje javascript, es decir, que hacen algo y siempre lo mismo, que nos pueden ser muy útiles en nuestros programas. Normalmente van dentro de otra función. Veamos alguna.
La función "setTimeout" se ejecutará (o "llamará a una función) una sola vez pasados x segundos.
setTimeout("nombreFuncion()",tiempo en milisegundos);
Un ejemplo:
setTimeout("reloj()",1000);
Aquí la función reloj se llamará ejecutándose pasados 1000 milisegundos (1 segundo) desde que el programa lee el setTimeout.
setTimeout("mostrarAviso()",3000);
function mostrarAviso(){
alert("Han pasado los tres segundos");
}
A los 3 segundos llamará a la función mostrarAviso, es decir a los 3 segundos saldrá un mensaje que nos dirá que pasaron 3 segundos.
Podemos poner en lugar de llamar a una función, llamar a una variable.
Esta instrucción window.open("direccion URL"); sirve para llevarte a una página web (¿Lo recuerdas?). Intenta crear un aviso que salga tras un segundo y, al hacer click en aceptar, nos lleve a una página web determinada.
(Solución)
setTimeout("iraweb()",1000);
function iraweb(){
alert("Ha pasado 1 segundo, te llevamos a la web");
window.open("http://www.marca.com");
}
Cuando pasa 1 segundo sale un aviso y al pulsar aceptar se abre una ventana nueva hacia la web especificada. Fíjate que el nombre de la función va entre comillas.
La función setInterval
La función setInterval sirve para especificar cada cuánto tiempo tiene que "llamarse" a una función, pero se llamará una y otra vez cada tiempo especificado, es decir, se repite la llamada cada x tiempo.
Imagina que queremos que se repita lo que hay dentro de una función cada 1000 milisegundos. Ojo: estará repitiéndose continuamente hasta que no especifiquemos que se pare.
setInterval("nombreFuncion()",1000);
En este caso nombreFuncion se repetiría cada 1000 milisegundos (1 segundo). El segundo parámetro (argumento) es el tiempo en milisegundos.
¿Qué hace el siguiente programa?
setInterval("repetir()",1000);
function repetir () {
alert ("Ha pasado 1 segundo")
}
Siii, sale un mensaje cada segundo. Pero cada segundo vuelve a salir el mismo mensaje. Imagina que queremos que se pare el mensaje a los 3 segundos.
Con clearInterval(nombreVariable); detendremos o pararemos la función que está en marcha con setInterval. Fíjate que entre paréntesis va el nombre de una variable, por eso es necesario asignar el setInterval a una variable, para luego pararlo con clearInterval.
Vamos a programar un botón en la página web, que nos permita pulsarlo para activar clearInterval, es decir que pare de repetir el mensaje solo cuando pulsemos el botón.
Para ello abre el archivo web.html y escribe dentro del <body> (cuerpo):
<input type="button" value="Parar el Mensaje" name="botonParar" onclick="clearInterval(bucleRepetir)" />
En el javascript escribe:
var bucleRepetir = setInterval("repetir()",1000);
function repetir () {
alert ("Ha pasado 1 segundo");
}
¡Ahora sí! Se repite la alerta cada segundo, pero si queremos parar que salga la alerta solo tendremos que pulsar el botón creado.
Tutorial de JavaScript (XIV)
[…] Tutorial de JavaScript (XIII) […]
ResponderEliminar[…] Tutorial de JavaScript (XIII) […]
ResponderEliminar