Artikel ini menjelaskan metode implementasi JavaScript Minute dan Timer Countdown Kedua. Bagikan untuk referensi Anda. Analisis spesifiknya adalah sebagai berikut:
1. Tujuan Dasar
Desain timer hitung mundur satu menit dan kedua di JavaScript, dan begitu waktu selesai, tombol menjadi tidak dapat diklicking.
Efek spesifiknya seperti yang ditunjukkan pada gambar di bawah ini. Untuk mengilustrasikan masalahnya, disesuaikan untuk melompati meja setiap 50 milidetik, yaitu, setiap 0,05.
Ketika Anda benar -benar menggunakannya, cukup sesuaikan setInterval ("clock.move ()", 50); di window.onload = function () {...} dari 50 hingga 1000.
Tombol masih dapat diklik sebelum waktu habis.
Setelah waktu digunakan, tombol tidak dapat diklik.
2. Proses Produksi
Salin kode sebagai berikut: <! Doctype html public "-// w3c // dtd xhtml 1.0 transisi // en" "http://www.w3.org/tr/xhtml1/dtd/xhtml1-transitional.dtd">
<html xmlns = "http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv = "konten tipe" content = "text /html; charset = utf-8" />
<title> waktu tersisa </iteme>
</head>
<!-Bagian html sangat sederhana. Teks baris dan kirim tombol yang perlu dikontrol oleh JavaScript semuanya ditulis dengan ID->
<body>
Sisa waktu: <span id = "timer"> </span>
<input id = "go" type = "kirim" value = "go" />
</body>
</html>
<script>
/*Fungsi yang akan digunakan oleh fungsi utama, nyatakannya*/
var jam = jam baru ();
/*Pointer ke timer*/
var timer;
window.onload = function () {
/*Fungsi utama hanya memanggil metode MOVE di fungsi jam sekali setiap 50 detik*/
timer = setInterval ("clock.move ()", 50);
}
function clock () {
/*S adalah variabel dalam jam (), variabel global yang bukan var, mewakili detik yang tersisa*/
this.s = 140;
this.move = function () {
/ *Sebelum output, hubungi fungsi pertukaran untuk dikonversi dari detik ke menit ke menit, karena pertukaran tidak digunakan di jendela fungsi utama.
document.geteLementById ("timer"). innerHtml = Exchange (this.s);
/*Setiap kali dipanggil, detik yang tersisa akan dikurangi dengan sendirinya*/
this.s = this.s-1;
/*Jika waktu habis, maka jendela pop-up membuat tombol tidak tersedia, berhenti memanggil pindahkan () di fungsi jam*/
if (this.s <0) {
waspada ("Time is Up");
document.geteLementById ("go"). Disabled = true;
ClearTimeout (timer);
}
}
}
function exchange (time) {
/*Divisi JavaScript adalah divisi Floating Point, dan harus menggunakan Math.floor untuk mengambil bagian integernya*/
this.m = math.floor (waktu/60);
/*Ada operasi residu*/
this.s = (waktu%60);
this.text = this.m+"menit"+this.s+"kedua";
/*Jangan gunakan ini untuk waktu parameter formal yang ditularkan, sedangkan variabel yang tersisa yang digunakan dalam fungsi ini harus menggunakan*/ini
kembalikan ini.text;
}
</script>
Saya harap artikel ini akan membantu pemrograman JavaScript semua orang.