4

我正在使用 Keith Wood 的 jQuery 倒数计时器。http://keith-wood.name/countdown.html

我想要实现的是带有停止和恢复按钮的计数，以及添加和减去分钟和秒的控件：

我创建了一个计数（从 0 到 60 分钟）并立即暂停它，如下所示：

$('#contador_tiempo').countdown({
    since: 0,
    format: 'MS',
    layout: '{mnn}{sep}{snn}'
});

$('#contador_tiempo').countdown('pause');

但它似乎仍在后台运行。当我单击按钮进行加法或减法时，这些函数会在该背景计数器之上执行操作，而不是在显示的计数器之上。

JSFiddle 上的完整代码，行为再现：

http://jsfiddle.net/J2XHm/4/

（稍微玩一下控件，您会发现它一直在计数，尽管它已暂停。）

4

2 回答 2

1

是的，“getTimes”命令中有一个错误——它会在暂停时重新计算。我将在下一个版本 (1.6.2) 中进行更正，但同时您可以更改 _getTimesPlugin 函数：

_getTimesPlugin: function(target) {
    var inst = $.data(target, this.propertyName);
    return (!inst ? null : (inst._hold == 'pause' ? inst._savePeriods : (!inst._hold ? inst._periods :
        this._calculatePeriods(inst, inst._show, inst.options.significant, new Date()))));
},
于 2013-04-15T00:46:18.823 回答
0

如果您可以接受轻量级代码，即不使用 jQuery 倒数计时器，以下内容可能会对您有所帮助：

<!DOCTYPE html>
<html>
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<script type="text/javascript" src="http://localhost/web/JavaScript/jQuery/jquery"></script>
<script type="text/javascript">
    var countUpSeconds = 0;
    var interval = null;
    function displayTime() {
          $("#timeContainer").text(format(Math.floor(countUpSeconds/60))+":"+format(countUpSeconds%60));
    }
    function playStop() {
        if(interval) {interval=window.clearInterval(interval);}
        else {interval = window.setInterval(countUp, 1000);}
    }
    function countUp() {
        ++countUpSeconds;
        if(countUpSeconds >= 3600) {/* do something when countup is reached*/}
        displayTime();
    }
    function format(s) {return s<10 ? "0"+s : s;}
    $(function() {
        displayTime();
        $("#playStop").on("click", function () { playStop(); } );
        $("#addMin").on("click", function () { countUpSeconds += 60; displayTime(); } );
        $("#subMin").on("click", function () { countUpSeconds = Math.max(0, countUpSeconds-60); displayTime(); } );
        $("#addSec").on("click", function () { countUpSeconds += 1; displayTime(); } );
        $("#subSec").on("click", function () { countUpSeconds = Math.max(0, countUpSeconds-1); displayTime(); } );

    });
</script>
</head>
<body>
<div id="timeContainer"></div>
<button id="playStop">Play/Stop</button>
<button id="addMin">+1 minute</button>
<button id="subMin">-1 minute</button>
<button id="addSec">+1 second</button>
<button id="subSec">-1 second</button>
</body>
</html>
于 2013-04-15T12:02:59.850 回答