tutorial pengembangan web terbaru
 

Jendela setInterval() Method

<Jendela Object

Contoh

Peringatan "Hello" setiap 3 detik (3000 milliseconds) :

setInterval(function(){ alert("Hello"); }, 3000);
Cobalah sendiri "

Lebih "Try it Yourself" contoh di bawah ini.

Definisi dan Penggunaan

The setInterval() metode panggilan fungsi atau mengevaluasi ekspresi pada selang waktu tertentu (in milliseconds) .

The setInterval() metode akan terus memanggil fungsi sampai clearInterval() disebut, atau jendela tertutup.

ID nilai yang dikembalikan oleh setInterval() digunakan sebagai parameter untuk clearInterval() metode.

Tip: 1000 ms = 1 detik.

Tip: Untuk melaksanakan fungsi hanya sekali, setelah sejumlah tertentu milidetik, gunakan setTimeout() metode.

Dukungan Browser

Angka-angka dalam tabel menentukan versi browser pertama yang sepenuhnya mendukung metode ini.

metode
setInterval() 1.0 4.0 1.0 1.0 4.0

Sintaksis

setInterval( function,milliseconds,param1,param2,... )

Nilai parameter

Parameter Deskripsi
function Wajib. Fungsi yang akan dieksekusi
milliseconds Wajib. Interval (in milliseconds) pada seberapa sering untuk mengeksekusi kode
param1,param2,... Pilihan. Parameter tambahan untuk lolos ke fungsi (Tidak didukung di IE9 dan sebelumnya)

Rincian teknis

Kembali Nilai: Sebuah Nomor, mewakili ID nilai timer yang ditetapkan. Gunakan nilai ini dengan clearInterval() metode untuk membatalkan timer
contoh

Contoh lebih

Contoh

Anda juga dapat merujuk ke "named" fungsi; Peringatan "Hello" setiap 3 detik (3000 milliseconds) :

var myVar;

function myFunction() {
    myVar = setInterval(alertFunc, 3000);
}

function alertFunc() {
    alert("Hello!");
}
Cobalah sendiri "

Contoh

Menampilkan waktu saat ini (the setInterval() metode akan melaksanakan fungsi sekali setiap 1 detik, seperti sebuah jam digital):

var myVar = setInterval(function(){ myTimer() }, 1000);

function myTimer() {
    var d = new Date();
    var t = d.toLocaleTimeString();
    document.getElementById("demo").innerHTML = t;
}
Cobalah sendiri "

Contoh

Menggunakan clearInterval() untuk menghentikan waktu pada contoh sebelumnya:

var myVar = setInterval(function(){ myTimer() }, 1000);

function myTimer() {
    var d = new Date();
    var t = d.toLocaleTimeString();
    document.getElementById("demo").innerHTML = t;
}

function myStopFunction() {
    clearInterval(myVar);
}
Cobalah sendiri "

Contoh

Menggunakan setInterval() dan clearInterval() untuk membuat progress bar yang dinamis:

function move() {
  var elem = document.getElementById("myBar");
  var width = 0;
  var id = setInterval(frame, 10);
  function frame() {
    if (width == 100) {
      clearInterval(id);
    } else {
      width++;
      elem.style.width = width + '%';
    }
  }
}
Cobalah sendiri "

Contoh

Beralih di antara dua warna background sekali setiap 300 milidetik:

var myVar = setInterval(function(){ setColor() }, 300);

function setColor() {
    var x = document.body;
    x.style.backgroundColor = x.style.backgroundColor == "yellow" ? "pink" : "yellow";
}

function stopColor() {
    clearInterval(myVar);
}
Cobalah sendiri "

Contoh

Melewatkan parameter ke fungsi alertFunc (does not work in IE9 and earlier) :

var myVar;

function myStartFunction() {
    myVar = setInterval(alertFunc, 2000, "First param", "Second param");
}
Cobalah sendiri "

Namun, jika Anda menggunakan fungsi anonim, ia akan bekerja di semua browser:

var myVar;

function myStartFunction() {
    myVar = setInterval(function(){ alertFunc("First param", "Second param"); }, 2000);
}
Cobalah sendiri "

Pages terkait

Jendela Object: href="met_win_clearinterval.html"> clearInterval() Method

Jendela Object: href="met_win_settimeout.html"> setTimeout() Method

Jendela Object: href="met_win_cleartimeout.html"> clearTimeout() Method

<Jendela Object