timer con setInterval en Jquery
setInterval es una función propia de Javascript, su funcionamiento es crear un intervalo de tiempo en milisegundos que no se dentendrá hasta no haber hecho una llamada a la función clearInterval.
setInterval("funcion()", milisegundos);
Vamos a ver un ejemplo en el cual hay dos botones uno START y otro STOP, al hacer click en el botón START entrará en funcionamiento setInterval y tendremos un número que se irá incrementando por cada intervalo de tiempo, y con el botón STOP entrará en funcionamiento la función clearInterval que detendrá el timer.
El código del ejemplo es el siguiente...
<html>
<head>
<script type='text/javascript' src='http://code.jquery.com/jquery-1.7.2.min.js'></script>
<script type="text/javascript">
var milisegundos = 1000;
var x = 0;
$(document).ready(function() {
$(":button#start").bind("click", function() {
timer = setInterval('temporizador()', milisegundos);
});
$(":button#stop").bind("click", function() {
timer = clearInterval(timer);
});
});
function temporizador() {
$(document).ready(function() {
$("#caja").html("<h1>
"+x+"<h1>
");
});
x++;
}
</script>
</head>
<body>
<input type="button" id="start" value="START">
<input type="button" id="stop" value="STOP">
<div id="caja">
</div>
</body>
</html>
No hay comentarios:
Publicar un comentario