JavaScript计数器不起作用

JavaScript counter doesn't work

本文关键字:不起作用 计数器 JavaScript      更新时间:2023-09-26

我做了一个这样的JavaScript计数器:

window.onload = function(){
    var target_date = new Date("Aug, 15, 2019").getTime();
}
var days, hours, minutes, seconds;
var countdown = document.getElementById("countdown");
setInterval(function (){
    var current_date = new Date().getTime();
    var seconds_left = (target_date - current_date) / 1000;
    days = parseInt(seconds_left / 86400);
    seconds_left = seconds_left % 86400;
    hours = parseInt(seconds_left / 3600);
    seconds_left = seconds_left % 3600;
    minutes = parseInt(seconds_left / 60);
    seconds = parseInt(seconds_left % 60);
    countdown.innerHTML= days + "d, " + hours + "h, " + minutes + "m, " + seconds + "s"; 
}, 1000); 

.HTML:

<span id="countdown"></span>

浏览器(谷歌Chorme)说:

Uncaught ReferenceError: target_date is not defined

即使我删除了window.onload = function(){},仍然不起作用。我做错了什么?

这一切都与变量作用域有关。在这里,您的target_date在您的window.onload中定义,使其成为该函数的本地。如果要在该函数外部使用该变量,请通过将变量移到函数外部来全局声明它:

var target_date; /* Declared globally. */
window.onload = function(){
    target_date = new Date("Aug, 15, 2019").getTime();
}

将第一个"}"更改为脚本末尾

window.onload = function(){
            var target_date = new Date("Aug, 15, 2019").getTime();
        var days, hours, minutes, seconds;
        var countdown = document.getElementById("countdown");
        setInterval(function (){
            var current_date = new Date().getTime();
            var seconds_left = (target_date - current_date) / 1000;
            days = parseInt(seconds_left / 86400);
            seconds_left = seconds_left % 86400;
            hours = parseInt(seconds_left / 3600);
            seconds_left = seconds_left % 3600;
            minutes = parseInt(seconds_left / 60);
            seconds = parseInt(seconds_left % 60);
            countdown.innerHTML= days + "d, " + hours + "h, " + minutes + "m, " + seconds + "s"; 
        }, 1000); 
        }

只需将窗口的大括号"}"移动到脚本的末尾

window.onload = function(){
    var target_date = new Date("Aug, 15, 2019").getTime();
    var days, hours, minutes, seconds;
    var countdown = document.getElementById("countdown");
    setInterval(function (){
        var current_date = new Date().getTime();
        var seconds_left = (target_date - current_date) / 1000;
        days = parseInt(seconds_left / 86400);
        seconds_left = seconds_left % 86400;
        hours = parseInt(seconds_left / 3600);
        seconds_left = seconds_left % 3600;
        minutes = parseInt(seconds_left / 60);
        seconds = parseInt(seconds_left % 60);
        countdown.innerHTML= days + "d, " + hours + "h, " + minutes + "m, " + seconds + "s"; 
    }, 1000);
}