Devdit
 

JavaScript นับเวลาถอยหลัง ด้วย setInterval

1.2K

JavaScript นับเวลาถอยหลัง ด้วย setInterval บทความนี้สอนการใช้คำสั่ง setInterval เพื่อนับเวลาถอยหลัง และใช้คำสั่ง clearInterval เพื่อหยุดการทำงานของ setInterval หรือการนับถอยหลัง สามารถเขียนโปรแกรมได้ดังนี้

 

ตัวอย่าง JavaScript นับเวลาถอยหลัง ด้วย setInterval

<div id="result"></div>
<script>
    let c = 5;
    var counter = setInterval(() => {
        document.getElementById("result").innerHTML = c;
        c--;
        if( c == -1 ) {
            clearInterval( counter );
            document.getElementById("result").innerHTML = "Finish";
        }
    }, 1000);
</script>

คำอธิบาย

JavaScript นับเวลาถอยหลัง ด้วย setInterval จากตัวอย่างโค้ดมีรายละเอียดดังนี้

1. กำหนดตัวแปร c เริ่มต้นเท่ากับ 5 โปรแกรมตัวนี้จะนับถอยหลัง 5 ถึง 1 และแสดงคำว่า Finish

2. ใช้คำสั่ง setInterval กำหนดให้ทำงานทุกๆ 1 วินาที หรือ 1000 มิลลิวินาที เก็บไว้ที่ตัวแปร counter

3. ภายในตัว setInterval อ้างถึง id = result และใช้คำสั่ง innerHTML เพื่อแสดงตัวเลขจากตัวแปร c

4. ให้ c-- เพื่อนับถอยหลัง และเช็คว่าถ้า c มีค่าเท่ากับ -1 ให้ยกเลิกการนับถอยหลัง หรือยกเลิกคำสั่ง setInterval ด้วยคำสั่ง clearInterval พร้อมแสดงข้อความ Finish

แก้ไข 6 เดือนที่แล้ว
ชอบ
ลิ้งก์
แชร์