Question

我有一个小脚本，应该用当前时间更新跨度。

此脚本在setInterval之前工作，但在setInterval期间不工作。

HTML：

<?= date("d/m/Y") ?> <span id="time"></span>

使用Javascript：

$(document).ready(function(){
    var dt = new Date();
    var time = dt.getHours() + ":" + dt.getMinutes();
    $("#time").text(time);
    setInterval(function(){
        console.log("interval");
        time = dt.getHours() + ":" + dt.getMinutes();
        $("#time").text(time);
    },5000);
});

带有id时间的跨度不会改变时间。

Answer 1

每次都需要设置dt，日期对象不会更新时间。它保留在创建时。

请参阅此代码和此fiddle

var dt = new Date();
var time = dt.getHours() + ":" + dt.getMinutes();

$("#time").text(time);

setInterval(function(){

    dt = new Date();
    time = dt.getHours() + ":" + dt.getMinutes();

    $("#time").text(time);

},5000);

Answer 2

您还需要更新dt对象。您的getHours()和getMinutes()函数可以在dt之前初始化的setInterval()对象上工作。如果您不重新初始化dt，它将占用缓存对象的日期。

setInterval(function(){
    console.log("interval");

    dt = new Date();                //here!

    time = dt.getHours() + ":" + dt.getMinutes();
    console.log(time)
    $("#time").text(time);
},5000);

<强> Demo

完整代码：

$(document).ready(function(){
    var dt = new Date();
    var time = dt.getHours() + ":" + dt.getMinutes();
    $("#time").text(time);
    setInterval(function(){
        console.log("interval");
        dt = new Date();
        time = dt.getHours() + ":" + dt.getMinutes();
        $("#time").text(time);
    },5000);
});

使用jquery更新时间跨度

2 个答案: