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 に答える