1. Pengatur waktu yang hanya dijalankan satu kali
Copy kode kodenya sebagai berikut:
<skrip>
//Timer berjalan secara asinkron
fungsi halo(){
peringatan("halo");
}
//Jalankan metode menggunakan nama metode
var t1 = window.setTimeout(halo,1000);
var t2 = window.setTimeout("hello()",3000);//Gunakan metode eksekusi string
window.clearTimeout(t1);//Hapus pengatur waktu
</skrip>
2. Pengatur waktu eksekusi berulang
Copy kode kodenya sebagai berikut:
<skrip>
fungsi halo(){
peringatan("halo");
}
// Mengulang suatu metode
var t1 = window.setInterval(halo,1000);
var t2 = jendela.setInterval("halo()",3000);
//Cara menghapus pengatur waktu
jendela.clearInterval(t1);
</skrip>
Komentar:
Jika ada dua metode pada suatu halaman, keduanya dijalankan setelah halaman dimuat, namun sebenarnya tidak dapat dijalankan secara berurutan, Anda dapat merujuk ke metode berikut untuk menyelesaikan masalah:
Anda dapat menambahkan pengatur waktu dalam metode onload, menyetel pengatur waktu, dan "menunda" selama jangka waktu tertentu sebelum menjalankannya. Hal ini dapat dipertimbangkan untuk membedakan urutan pemuatan halaman dan metode yang dijalankan.
Di JavaScript, ada dua fungsi khusus untuk pengatur waktu, yaitu:
1. Penghitung waktu mundur: timename=setTimeout("function();",delaytime);
2. Pengatur waktu putaran: timename=setInterval("function();",delaytime);
Parameter pertama "fungsi ()" adalah tindakan yang akan dijalankan ketika pengatur waktu dipicu. Ini bisa berupa satu fungsi atau beberapa fungsi. Misalnya, jika Anda ingin memunculkan dua jendela peringatan, Anda dapat mengganti "function();" dengan
"alert('Jendela peringatan pertama!');alert('Jendela peringatan kedua!');"; dan parameter kedua "waktu tunda" adalah interval waktu dalam milidetik, yaitu mengisi "5000" berarti 5 detik.
Penghitung waktu mundur memicu suatu peristiwa setelah waktu yang ditentukan tercapai, sedangkan penghitung waktu loop memicu peristiwa berulang kali ketika interval waktu tiba. Perbedaan antara keduanya adalah yang pertama hanya bertindak satu kali, sedangkan yang kedua bertindak terus menerus.
Misalnya, setelah Anda membuka halaman dan ingin melompat ke halaman lain secara otomatis setiap beberapa detik, Anda perlu menggunakan penghitung waktu mundur "setTimeout("function();",delaytime)", dan jika Anda ingin menyetel kalimat tertentu muncul satu per satu,
Anda perlu menggunakan pengatur waktu loop "setInterval("function();",delaytime)".
Untuk mendapatkan fokus formulir digunakan document.activeElement.id. Gunakan if untuk menentukan apakah document.activeElement.id dan ID formulir sama.
Misalnya: if ("mid" == document.activeElement.id) {alert();}, "mid" adalah ID yang sesuai dengan formulir.
pengatur waktu:
Digunakan untuk menentukan program yang akan dieksekusi setelah jangka waktu tertentu.
Waktu eksekusi di JS, perbedaan antara setTimeout dan setInterval, dan metode pembatalan
setTimeout(Expression,DelayTime), setelah DelayTime, Ekspresi akan dieksekusi. setTimeout digunakan untuk menunda selama jangka waktu tertentu sebelum melakukan operasi.
setTimeout("function",time) menyetel objek batas waktu
setInterval(ekspresi, waktu tunda), setiap DelayTime akan menjalankan Ekspresi.
setInterval("function",time) menyetel objek batas waktu
SetInterval berulang secara otomatis, dan setTimeout tidak berulang.
clearTimeout(object) menghapus objek setTimeout yang disetel
clearInterval(object) membersihkan objek setInterval
Berikan saja dua contoh.
Contoh 1. Saat formulir dipicu atau dimuat, string akan dikeluarkan kata demi kata.
Copy kode kodenya sebagai berikut:
<html>
<kepala>
<meta http-equiv="Jenis Konten" content="teks/html; charset=gb2312" />
<title>Dokumen Tanpa Judul</title>
<skrip bahasa="JavaScript" type="teks/javascript">
var str = "Ini adalah contoh teks untuk pengujian";
var seq = 0;
var detik=1000; //Interval waktu 1 detik
fungsi gulir() {
pesan = str.substring(0, seq+1);
document.getElementByIdx_x_x('word').innerHTML = pesan;
urutan++;
if (seq >= str.panjang) seq = 0;
}
</skrip>
</kepala>
<body onload="setInterval('scroll()',kedua)">
<div id="kata"></div><br/><br/>
</tubuh>
</html>
Contoh 2. Saat fokus berada pada kotak masukan, periksa informasi kotak masukan secara rutin, dan jangan lakukan tindakan pengecekan saat fokus tidak menyala.
Copy kode kodenya sebagai berikut:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<kepala>
<meta http-equiv="Jenis Konten" content="teks/html; charset=gb2312" />
<title>Dokumen Tanpa Judul</title>
<skrip bahasa="JavaScript" type="teks/javascript">
var detik=5000; //Interval waktu 5 detik
var c=0;
fungsi gulir() {
c++;
if ("b" == dokumen.activeElement.id) {
var str="Pemeriksaan terjadwal<b> "+c+" </b>waktu<br/>";
if(document.getElementByIdx_x_x('b').value!=""){
str+="Isi kotak masukan saat ini adalah<br/><b> "+document.getElementByIdx_x_x('b').value+"</b>";
}
document.getElementByIdx_x_x('kata').innerHTML = str;
}
}
</skrip>
</kepala>
<tubuh>
<textarea id="b" name="b" style="height:100px; width:300px;" onfocus="setInterval('scroll()',detik)"></textarea><br/><br/ >
<div id="kata"></div><br/><br/>
</tubuh>
</html>
Contoh 3. Berikut ini adalah contoh paling sederhana. Jendela peringatan muncul setelah penghitung waktu berakhir.
Copy kode kodenya sebagai berikut:
<html xmlns="http://www.w3.org/1999/xhtml">
<kepala>
<meta http-equiv="Jenis Konten" content="teks/html; charset=gb2312" />
<skrip bahasa="javascript">
jumlah fungsi() {
document.getElementByIdx_x_x('m').innerHTML="Pengatur waktu telah dimulai!";
setTimeout("alert('Sepuluh detik naik!')",10000)
}
</skrip>
<tubuh>
<div id="m"></div>
<input TYPE="button" value="Pengatur waktu dimulai" onclick="count()">
</tubuh>
</html>
Contoh 4: Lompatan waktu hitung mundur
Copy kode kodenya sebagai berikut:
<html>
<kepala>
<base href="<%=basePath%>">
<title>Halaman awal JSP 'ds04.jsp' saya</title>
<span id="tiao">3</span>
<a href="javascript:countDown"> </a> Secara otomatis melompat setelah beberapa detik...
<meta http-equiv=segarkan konten=3;url= '/ds02.jsp'/>
<!--Script dimulai-->
<skrip bahasa="javascript" type="">
fungsi hitung mundur(detik){
tiao.innerText=detik;
if(--detik>0)
setTimeout("hitung mundur("+detik+")",1000);
}
hitung mundur(3);
</skrip>
<!--Akhir skrip-->
</kepala>
Contoh 6:
Copy kode kodenya sebagai berikut:
<kepala>
<meta http-equiv="refresh" content="2;url='b.html'">
</kepala>
Contoh 7:
Copy kode kodenya sebagai berikut:
<skrip bahasa="javascript" type="teks/javascript">
setTimeout("window.location.href='b.html'", 2000);
//Kedua hal berikut dapat digunakan
//setTimeout("javascript:location.href='b.html'", 2000);
//setTimeout("window.location='b.html'", 2000);
</skrip>
Contoh 8:
Copy kode kodenya sebagai berikut:
<span id="totalSecond">2</span>
<skrip bahasa="javascript" type="teks/javascript">
var detik = document.getElementByIdx_x('totalSecond').innerHTML;
if(isNaN(detik)){
//...bukan metode pemrosesan numerik
}kalau tidak{
setInterval(fungsi(){
document.getElementByIdx_x('totalSecond').innerHTML = --detik;
jika (detik <= 0) {
window.lokasi = 'b.html';
}
}, 1000);
}
</skrip>