funciones Javascript – setInterval() clearInterval() setTimeout()

ESTE POST HA SIDO ACTUALIZADO Y TRADUCIDO, CONSULTARLO EN:
funciones Javascript – setInterval() clearInterval() setTimeout() – Parte 2

setInterval()

This method is used to repeatedly execute a function at a set interval. The format for this method is:

window.setInterval("functionName()",time);

The first parameter (“functionName()”) is the name of the function that you want to have executed. Notice that the function name is in quotes. It’s treated as a string to prevent it from executing immediately. The second parameter (time) is the amount of the delay in milliseconds, between each time the function is executed (1 minute = 60000 milliseconds). This is useful in animation, for rotating pictures in a gallery or perhaps refreshing the screen. For instance, to reload a page after an interval of 10 minutes (600,000 milliseconds), try this script:

function reFresh() {

  location.reload(true)

}

window.setInterval("reFresh()",600000);

clearInterval()

This method is used to stop the timed loop which was started with the setInterval() method above. The format is:

window.clearInterval(varName);

In order to use it, the loop must be assigned to a variable.

Let’s go back to our page refresh script above. We only need to add the var reserved word in front of the setInterval() loop:

function reFresh() {

  window.open(location.reload(true))

}

var repeat=window.setInterval("reFresh()",600000);

Then we could create a button to stop the page refresh:

<form>

  // The next two lines should all be on one line

  <input type="Button" value="Stop the Page Refresh"

    onclick="window.clearInterval(repeat);">

</form>

The function is the same as we created previously except, as I noted, the setInterval method has now been assigned to a variable. The button we created merely says to clear the time interval of the variable repeat. If you want to see this script in action at a faster pace, change the time interval from 600000 (10 minutes) to 60000 (1 minute). Once you load the page, go back and edit the page, adding something to it, and save it. Then, go back to the browser and wait for it to refresh.

setTimeout()

This method is used to execute a JavaScript function after a predetermined amount of time. (The name is a bit misleading. It doesn’t stop the script for a period of time; it waits a period of time before beginning.) Unlike the setInterval() method, it only executes once. You will remember we used this when we looked at the blur() and focus() methods. It was used to give the IE browser time to catch up before we printed data to the new window. The format is:

window.setTimeout("functionName()",time);

This method has many different applications. It could be used in a game, to set a specified amount of time for performing a procedure, to reset a page when the computer is set up in a kiosk environment or it could be used to popup a window for a friendly reminder to a visitor. There are many other applications. The trick is not to annoy your visitors. Let’s take a look at how this methods works:

function inquire() {

  alert("Are you still there?");

}

var ask=window.setTimeout("inquire()",10000);

clearTimeout()

This method is used for clearing the time interval set by the setTimeout() method. It works along the same lines as the clearInterval. Using our script above, let’s see how it works. First, here’s our setTimeout script:

function inquire() {

  alert("Are you still there?");

}

var ask=window.setTimeout("inquire()",10000);

Next, we add a button to our page to cancel the alert window in the inquire function:

<form>

  // The next two lines should all be on one line

  <input type="Button" value="Stop the Alert Window"

    onclick="window.clearInterval(ask);">

</form>

This button can be used to stop the action that will be executed by the setTimeout method.

Conclusion

That wraps up of look at the methods associated with the window object. In the next installment we will take a look at some of the event handlers and see how we can use them.

MAS EN : http://www.webreference.com/programming/javascript/diaries/8/6.html

2 opiniones en “funciones Javascript – setInterval() clearInterval() setTimeout()”

  1. Pingback: funciones Javascript – setInterval() clearInterval() setTimeout() – 2 | Pedro Ventura

Deja un comentario

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *