Finestra setInterval()
Esempi
Visualizza "Hello" ogni secondo (1000 millisecondi):
setInterval(function () {element.innerHTML += "Hello"}, 1000);
Display di chiamataCiao ogni secondo:
setInterval(displayHello, 1000);
Altri esempi di seguito.
Definizione e utilizzo
Il setInterval()
metodo chiama una funzione a intervalli specificati (in millisecondi).
Il setInterval()
metodo continua a chiamare la funzione finché non
clearInterval()
viene chiamata o la finestra non viene chiusa.
1 secondo = 1000 millisecondi.
Nota
Per eseguire la funzione solo una volta, utilizzare setTimeout()
invece il metodo.
Per cancellare un intervallo, utilizzare l' id restituito da setInterval():
myInterval = setInterval(function, milliseconds);
Quindi puoi interrompere l'esecuzione chiamando clearInterval():
clearInterval(myInterval);
Guarda anche:
Sintassi
setInterval(function, milliseconds, param1, param2, ...)
Parametri
Parameter | Description |
function | Required. The function to execute |
milliseconds | Required. The execution interval. If the value is less than 10, 10 is used |
param1, param2, ... | Optional. Additional parameters to pass to the function Not supported in IE9 and earlier. |
Valore di ritorno
Tipo | Descrizione |
Un numero | L'ID del timer. Utilizzare questo ID con clearInterval() per annullare il timer. |
Altri esempi
Esempio
Visualizza l'ora come un orologio digitale:
setInterval(myTimer, 1000);
function myTimer()
{
const date = new Date();
document.getElementById("demo").innerHTML = date.toLocaleTimeString();
}
Esempio
Usando clearInterval() per fermare l'orologio digitale:
const myInterval = setInterval(myTimer, 1000);
function myTimer() {
const date = new Date();
document.getElementById("demo").innerHTML = date.toLocaleTimeString();
}
function myStopFunction()
{
clearInterval(myInterval);
}
Esempio
Usando setInterval() e clearInterval() per creare una barra di avanzamento dinamica:
function move() {
const element = document.getElementById("myBar");
let width = 0;
let id = setInterval(frame, 10);
function frame() {
if (width == 100) {
clearInterval(id);
} else {
width++;
element.style.width = width + '%';
}
}
}
Esempio
Alternare tra due colori di sfondo una volta ogni 500 millisecondi:
const myInterval = setInterval(setColor, 500);
function setColor() {
let x = document.body;
x.style.backgroundColor = x.style.backgroundColor == "yellow" ? "pink" : "yellow";
}
function stopColor() {
clearInterval(myInterval);
}
Esempio
Passa i parametri alla funzione (non funziona in IE9 e precedenti):
setInterval(myFunc, 2000, "param1", "param2");
Tuttavia, se utilizzi una funzione anonima, funziona in tutti i browser:
setInterval(function() {myFunc("param1", "param2")}, 2000);
Supporto browser
setInterval()
è supportato in tutti i browser:
Chrome | IE | Edge | Firefox | Safari | Opera |
Yes | Yes | Yes | Yes | Yes | Yes |