如何让 setInterval 函数工作？

Question

对于我的学校项目，我试图显示一个实时刷新 hours/minutes/seconds 的时钟。我想使用 SetInterval 还是错误的想法？谁能帮帮我？

        <h1 id="dag">Uw Dag</h1>
        <h2 id='full'>a</h2>
        <h3 id='tijd'>tijd</h3>


function addZero(i) {
    if (i < 10) {
        i = "0" + i;
    }
    return i;
}

function headerDag() {
    var d = new Date();
    var weekdays = ["Zondag", "Maandag", "Dinsdag", "Woensdag", "Donderdag", "Vrijdag", "Zaterdag"];
    var weekday = weekdays[d.getDay()];
    return weekday;
}

function getActualFullDate() {
    setInterval(getActualFullDate, 3000);
    var months = ["Januari", "Februari", "Maart", "April", "Mei", "Juni", "Juli", "Augustus", "September", "Oktober", "November", "December"];
    var d = new Date();
    var day = addZero(d.getDate());
    var month = months[d.getMonth()];
    var year = addZero(d.getFullYear());
    var h = addZero(d.getHours());
    var m = addZero(d.getMinutes());
    var s = addZero(d.getSeconds());
    return day + "  " + month + "  " + year + " " + h + ":" + m + ":" + s;

}


$(document).ready(function() {

    $("#full").html(getActualFullDate());
    $("#dag").html(headerDag());


});

Answer 1

getActualFullDate() 不会更新 HTML，它只是 returns 一个字符串。区间函数需要调用.html().

function addZero(i) {
    if (i < 10) {
        i = "0" + i;
    }
    return i;
}

function headerDag() {
    var d = new Date();
    var weekdays = ["Zondag", "Maandag", "Dinsdag", "Woensdag", "Donderdag", "Vrijdag", "Zaterdag"];
    var weekday = weekdays[d.getDay()];
    return weekday;
}

function getActualFullDate() {
    var months = ["Januari", "Februari", "Maart", "April", "Mei", "Juni", "Juli", "Augustus", "September", "Oktober", "November", "December"];
    var d = new Date();
    var day = addZero(d.getDate());
    var month = months[d.getMonth()];
    var year = addZero(d.getFullYear());
    var h = addZero(d.getHours());
    var m = addZero(d.getMinutes());
    var s = addZero(d.getSeconds());
    return day + "  " + month + "  " + year + " " + h + ":" + m + ":" + s;

}

$(document).ready(function() {
    setInterval(function () {
        $("#full").html(getActualFullDate());
        $("#dag").html(headerDag());
    }, 3000);
});

Answer 2

给你！基本上，我认为你无意中添加了递归。当您运行代码段时，请查看我在下面所做的更改。

function addZero(i) {
    if (i < 10) {
        i = "0" + i;
    }
    return i;
}

function headerDag() {
    var d = new Date();
    var weekdays = ["Zondag", "Maandag", "Dinsdag", "Woensdag", "Donderdag", "Vrijdag", "Zaterdag"];
    var weekday = weekdays[d.getDay()];
    return weekday;
}

function getActualFullDate() {
      var months = ["Januari", "Februari", "Maart", "April", "Mei", "Juni", "Juli", "Augustus", "September", "Oktober", "November", "December"];
      var d = new Date();
      var day = addZero(d.getDate());
      var month = months[d.getMonth()];
      var year = addZero(d.getFullYear());
      var h = addZero(d.getHours());
      var m = addZero(d.getMinutes());
      var s = addZero(d.getSeconds());
      let full = day + "  " + month + "  " + year + " " + h + ":" + m + ":" + s;
      $("#full").html(full);
}


$(document).ready(function() {
    getActualFullDate();
    setInterval(function() {
      getActualFullDate();
    }, 3000);
    
    $("#dag").html(headerDag());


});

<html>
<head>
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
</head>
<body>
  <h1 id="dag">Uw Dag</h1>
  <h2 id='full'>a</h2>
  <h3 id='tijd'>tijd</h3>
</body>
</html>

如何让 setInterval 函数工作？

How to get the setInterval function working?

javascript

time

jquery

clock

setinterval