分/秒倒数计时器没有倒计时？答案

【问题标题】：Minutes/seconds countdown timer not ticking down?分/秒倒数计时器没有倒计时？
【发布时间】：2016-12-31 02:25:27
【问题描述】：

我正在尝试在 JS 中制作一个简单的计时器，从 25 分钟开始倒计时。

$(document).ready(function() {
	    updateClock();
	    var timeInterval = setInterval(updateClock(), 1000);
    });

    var ms = 1500000;
    var minutes = Math.floor(ms / 1000 / 60);
    var seconds = Math.floor((ms / 1000) % 60);

    function updateClock() {
	    ms -= 1000;
	    if (ms <= 0) {
		    clearInterval(timeInterval);
	    };
	    $('#minutes').html(minutes);
	    $('#seconds').html(seconds);
    }

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="minutes"></div>
	<div id="seconds"></div>

我不明白为什么页面只显示 25 和 0，而且从不向下滴答。我是否错误地使用了 setInterval()？

【问题讨论】：

试试：setInterval(updateClock, 1000)
试过了，还是不行；无论如何感谢您的建议。
你没有更新updateClock()中的分钟和秒值

标签： javascript jquery

【解决方案1】：

您需要在updateClock() 函数中计算minutes 和seconds 的值。目前，它们从未从初始值更新。

另外，在设置区间的时候，不要在函数名后面加上括号，否则只是传递了一个对返回值的引用，而不是函数本身：

var timeInterval;
    
$(document).ready(function() {
    updateClock();
    timeInterval = setInterval(updateClock, 1000);
});

var ms = 1500000;

function updateClock() 
{
    ms -= 1000;
    
    var minutes = Math.floor(ms / 1000 / 60),
        seconds = Math.floor((ms / 1000) % 60);
    
    if (ms <= 0) 
    {
        clearInterval(timeInterval);
    };
    
    $('#minutes').html(minutes);
    $('#seconds').html(seconds);
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="minutes"></div>
<div id="seconds"></div>

【讨论】：

感谢您的帮助！不过，您能否解释一下关于不在函数名称中添加括号的部分？ “它只是传递对返回值的引用”是什么意思？
没问题：如果在 setInterval() 的函数名称中添加括号，Javascript 会将该函数的 返回值 传递给 setInterval，而不是调用每x毫秒运行一次。

【解决方案2】：

您又忘记更新分钟和秒数了。

function updateClock() {
    ms -= 1000;
    if (ms <= 0) {
        clearInterval(timeInterval);
    };
    minutes = Math.floor(ms / 1000 / 60);
    seconds = Math.floor((ms / 1000) % 60);
    $('#minutes').html(minutes);
    $('#seconds').html(seconds);
}

【讨论】：