วิธีสร้าง: JavaScript นับถอยหลัง
- หน้าก่อน ไอคอนอนิมาติก
- หน้าต่อไป ฟีลท์แบบโทรไลน์
เรียนรู้ว่าเช่นไรจะสร้างเวลานับถอยหลังด้วย JavaScript
สร้างเวลานับถอยหลัง
ตัวอย่าง
<!-- แสดงเวลานับถอยหลังในองค์ประกอบ --> <p id="demo"></p> <script> // ตั้งวันที่ที่เราต้องการนับถอยหลัง var countDownDate = new Date("Jan 5, 2024 15:37:25").getTime(); // ปรับปรุงนับถอยหลังทุก 1 วินาที var x = setInterval(function() { // รับวันที่และเวลาปัจจุบัน var now = new Date().getTime(); // คำนวณระยะทางระหว่างวันที่ปัจจุบันและวันที่นับถอยหลัง var distance = countDownDate - now; // คำนวณจำนวนวันที่ ชั่วโมง นาที และวินาที var days = Math.floor(distance / (1000 * 60 * 60 * 24)); var hours = Math.floor((distance % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60)); var minutes = Math.floor((distance % (1000 * 60 * 60)) / (1000 * 60)); var seconds = Math.floor((distance % (1000 * 60)) / 1000); // แสดงผลในองค์ประกอบที่ id="demo" document.getElementById("demo").innerHTML = days + "d " + hours + "h " + minutes + "m " + seconds + "s "; // ถ้าการนับถอยหลังเสร็จสิ้น ขึ้นตารางข้อความ if (distance < 0) { clearInterval(x); document.getElementById("demo").innerHTML = "EXPIRED"; } , 1000); </script>
หน้าที่เกี่ยวข้อง
คู่มืออ้างอิง:JavaScript วิธี window.setInterval()
- หน้าก่อน ไอคอนอนิมาติก
- หน้าต่อไป ฟีลท์แบบโทรไลน์