Question

我正在使用Keith Wood的jQuery Countdown计时器。 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/

（使用控件稍微玩一下，你会发现虽然已暂停，但它会继续计数。）

Answer 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()))));
},

Answer 2

如果您可以接受轻量级代码，即不使用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>

jQuery倒计时在暂停时运行

2 个答案: