JavaScript倒计时失效始终显示00:00:00:00，求技术支持

你的倒计时功能失效是因为代码里存在3个关键错误，以下是问题点和修复方案：

问题排查 #

• 函数调用缺失括号：new Date().getTime 没有加()，导致now存储的是getTime函数本身而非当前时间戳，计算差值时会得到非法值。
• 变量名大小写不匹配：定义的变量是countDownDate，但计算时写成了countDowndate，JavaScript变量名区分大小写，这会导致distance为NaN，最终所有时间值显示为0。
• 语法结构错误：setInterval的匿名函数没有正确闭合，代码末尾的1000);前缺少}，导致定时器代码无法正常执行。

修复后的完整代码 #

JavaScript部分 #

<script>
// 目标倒计时时间戳
var countDownDate = new Date("Jan 5, 2024 15:37:25").getTime(); 

var x = setInterval(function() {
    // 获取当前时间戳（修复：添加getTime()调用）
    var now = new Date().getTime(); 
    // 修复变量名大小写：countDowndate -> countDownDate
    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);

    // 为小于10的数字补0，优化显示格式
    days = days < 10 ? "0" + days : days;
    hours = hours < 10 ? "0" + hours : hours;
    minutes = minutes < 10 ? "0" + minutes : minutes;
    seconds = seconds < 10 ? "0" + seconds : seconds;

    // 更新DOM内容
    document.getElementById("days").innerHTML = days;
    document.getElementById("hours").innerHTML = hours;
    document.getElementById("minutes").innerHTML = minutes;
    document.getElementById("seconds").innerHTML = seconds;

    // 倒计时结束后重置显示
    if (distance < 0) {
        clearInterval(x);
        document.getElementById("days").innerHTML = "00";
        document.getElementById("hours").innerHTML = "00";
        document.getElementById("minutes").innerHTML = "00";
        document.getElementById("seconds").innerHTML = "00";
    }
}, 1000); // 修复：闭合匿名函数，规范定时器参数格式
</script>

HTML部分（结构无问题，可直接使用） #

<div class="launch-time">
    <div>
        <p id="days">00</p>
        <span>days</span>
    </div>
    <div>
        <p id="hours">00</p>
        <span>Hours</span>
    </div>
    <div>
        <p id="minutes">00</p>
        <span>Minutes</span>
    </div>
    <div>
        <p id="seconds">00</p>
        <span>Seconds</span>
    </div>
</div>

修复后代码会正确计算目标时间与当前时间的差值，同时为单数字时间补0，保证显示格式统一；若目标日期已过，会自动切换为00:00:00:00。

内容的提问来源于stack exchange，提问作者tengo