Question

嗨，这是我的闹钟，到目前为止它是有效的。我有一个问题，我不能让它每秒更新，当我尝试这样做时说：

script.js:19 Uncaught ReferenceError: min is not defined
    at timer (script.js:19)
    at script.js:31

但是如果我没有把它放在一个函数中并试图更新时间，它就没有错误。

我试过setInterval和setTimeout都没有工作

这是我的HTML：

<!DOCTYPE HTML>
<html lang="en">

<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Digital Alarm Clock</title>
    <link rel="stylesheet" type="text/css" href="style.css">
    <script src="https://code.createjs.com/createjs-2015.11.26.min.js"></script>
</head>

<body>
    <div id="myClock">
        <div id="period">
            <span id="day"></span>
            <span id="date"></span>
            <span id="month"></span>
            <span id="year"></span>
        </div>
        <div id="time">
            <span id="hour"></span>
            <span id="minute"></span>
            <span id="second"></span>
        </div>
    </div>
    <br>
    <form>
        <input type="date" class="unstyled">
        <input type="time">
    </form>
    <div id="alarmBox">
        <div class="box">
            <h1>alarm</h1>
        </div>
    </div>
    <script src="script.js"></script>

</body>

</html>

这里开始我的javascript

function timer() {
    const DATE = new Date();
    var monthNames = ["January", "Febuary", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December"];
    var dayNames = ["Monday", "Tuesday", "Wendesday", "Thursday", "Friday", "Saturday", "Sunday"];
    console.log(DATE);
    document.getElementById('year').innerHTML = DATE.getFullYear();
    document.getElementById('month').innerHTML = monthNames[DATE.getMonth()];
    document.getElementById('date').innerHTML = DATE.getDate();
    document.getElementById('day').innerHTML = dayNames[DATE.getDay() - 1];
    var hour = document.getElementById('hour').innerHTML = DATE.getHours();
    var min = document.getElementById('minute').innerHTML = DATE.getMinutes();
    var sec = document.getElementById('second').innerHTML = DATE.getSeconds();
    //change the vars types to string and check if it's 1 or 2 digits
    hour = hour.toString()
    if (hour.length < 2) {
        //prepend a 0 to the string to pad if necessary
        hour = '0' + hour;
    }
    min = min.toString()
    if (min.length < 2) {
        //prepend a 0 to the string to pad if necessary
        min = '0' + min;
    }
    sec = sec.toString()
    if (sec.length < 2) {
        sec = '0' + sec;
    }
    var theTime = document.getElementById('time').innerHTML = hour + " : " + min + " : " + sec;
    setTimeout(timer, 1000);
}
timer();

Answer 1

试试这个：

    function timer() {
    const DATE = new Date();
    let monthNames = ["January", "Febuary", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December"];
    let dayNames = ["Monday", "Tuesday", "Wendesday", "Thursday", "Friday", "Saturday", "Sunday"];
    console.log(DATE);
    document.getElementById('year').innerHTML = DATE.getFullYear();
    document.getElementById('month').innerHTML = monthNames[DATE.getMonth()];
    document.getElementById('date').innerHTML = DATE.getDate();
    document.getElementById('day').innerHTML = dayNames[DATE.getDay() - 1];
    let hour = document.getElementById('hour').innerHTML = DATE.getHours();
    let min = document.getElementById('minute').innerHTML = DATE.getMinutes();
    let sec = document.getElementById('second').innerHTML = DATE.getSeconds();
    //change the lets types to string and check if it's 1 or 2 digits
    hour = hour.toString()
    if (hour.length < 2) {
        //prepend a 0 to the string to pad if necessary
        hour = '0' + hour;
    }
    min = min.toString()
    if (min.length < 2) {
        //prepend a 0 to the string to pad if necessary
        min = '0' + min;
    }
    sec = sec.toString()
    if (sec.length < 2) {
        sec = '0' + sec;
    }
    let theTime = document.getElementById('time').innerHTML = hour + " : " + min + " : " + sec;
    setTimeout(timer, 1000);
}
timer();

<p id="year"></p>
<p id="month"></p>
<p id="date"></p>
<p id="day"></p>
<p id="hour"></p>
<p id="minute"></p>
<p id="second"></p>
<p id="time"></p>

我运行了你的脚本，它运行正常，没有错误。好吧，我将 var 转换为让，这样如果有任何范围问题（如果从另一个文件运行），那么您可能无法获得错误。

闹钟Javascript

1 个答案: