Metodo setInterval() della finestra

Oggetto Window JavaScript

setInterval()Metodo che chiama ripetutamente una funzione o esegue un segmento di codice con un ritardo fisso tra le chiamate.

Il metodo setInterval() chiama continuamente la funzione o il codice specificato fino a quando non viene chiamatoclearInterval()Metodo o chiudendo la finestra.

Questo metodo restituisce un ID di intervallo univoco che identifica l'intervallo, quindi puoi annullarlo in seguito chiamando clearInterval() o chiudendo la finestra.

Per eseguire una funzione una volta soltanto entro un determinato numero di millisecondi, utilizzaresetTimeout()Metodo.

Sintassi：

window.setInterval(function, delay, param1, param2, ...)

setInterval(function(){ alert("Hello World"); }, 2000);

Compatibilità del browser

I numeri nella tabella specificano la prima versione del browser che supporta completamente il metodo setInterval():

Valore del parametro

Dettagli tecnici

Più esempi

Questo esempio fa riferimento a una funzione "esterna" denominata:

var intervalID;
funzione myFunc() {
　　intervalID = setInterval(myCallback, 2000);
}
funzione myCallback() {
　　alert("Hello World");
}

Mostra l'ora corrente (esattamente come un orologio digitale, esegue la funzione "startTimer()" ogni 1 secondo):

var intervalID = setInterval(startTimer, 1000);
funzione startTimer() {
　　　var date = new Date();
　　　var x = document.getElementById("result");
　　　x.innerHTML = date.getHours() + ":" + date.getMinutes() + ":" + date.getSeconds();
}

Nell'esempio precedente, utilizzare clearInterval() per fermare il tempo:

var intervalID = setInterval(startTimer, 1000);
funzione startTimer() {
　　　var date = new Date();
　　　var x = document.getElementById("result");
　　　x.innerHTML = date.getHours() + ":" + date.getMinutes() + ":" + date.getSeconds();
}
funzione stopTimer() {
　　　clearInterval(intervalID);
}

Cambiare tra due colori di sfondo ogni 200 millisecondi fino a che clearInterval() non lo ferma:

var t = setInterval(setColor, 200);
funzione setColor() {
　　　var x = document.body;
　　　x.style.backgroundColor = (x.style.backgroundColor == "coral") ? "lightgreen" : "coral";
}
funzione stopColor() {
　　　clearInterval(t);
}

Creare una barra di progresso dinamica utilizzando setInterval() e clearInterval():

var i = 0;
var bar = document.getElementById("progress-bar");
var t;
funzione start() {
　　t = setInterval(progress, 60);
}
funzione progress() {
　　se (i < 100) {
　i++;
　bar.style.width = i + "%";
　bar.innerHTML = i + "　%";
　　}
　clearInterval(t);
　　}
}
function stop() {
　　clearInterval(t);
}

Passa parametri alla funzione myFunc (non funziona in Internet Explorer 9 e versioni precedenti):

var intervalID = setInterval(myFunc, 2000, "First", "Second", "Third");

Ma, se usi una funzione anonima, funzionerà in tutti i browser:

var intervalID = setInterval(function(){ myFunc("First", "Second", "Third"); }, 2000);

Riferimenti correlati

Riferimento finestra (Window):Metodo clearInterval()

Riferimento finestra (Window):Metodo setTimeout()

Riferimento finestra (Window):Metodo clearTimeout()

Oggetto Window JavaScript