1

我有以下功能：

$(document).ready(function() {
    $('#p').click(function() {
        $('#s1').hide();
        gameStart(); <-starts timer
        $('#s2').show();
    });

    $('.b4').click(function() {
        clearInterval(tI); <-stops the time
    });
    $('#r').click(function() {
        tI = setInterval("setTimer()", 1000); <-not working, should continue the timer again
    });
});

单击div 时#p，它将开始一个带有计时器的游戏，这一切都有效。现在，如果我单击 div.b4它将停止/暂停计时器，这也可以。问题是再次启动计时器，从停止的地方继续。

我tI = setInterval("setTimer()", 1000);在单击 div 时尝试过，#r但问题是它会启动计时器，但它不会从停止时继续。它会继续，但如果它没有停止/暂停，它应该从它应该的时间开始。

那么我该如何解决这个问题？我想暂停时间（认为我有这部分权利），然后单击时再次继续#r

这就是我的计时器功能的构建方式：

function gameStart() {
    setBlocks();
    tM = $('#a1 div.tm');
    hS = $('#a1 div.hs');
    oT = new Date();
    tI = setInterval("setTimer()", 1000);
    setHs();
    $('.ht').click(hint);
    $('.b3').click(reset);
}


//Set timer
function setTimer() {
    var n = new Date();
    tM.text(getTimeText(n.getTime() - oT.getTime()));
}

//Build timer
function getTimeText(v) {
    var vH = Math.floor(v / 3600000);
    var vM = Math.floor((v - (vH * 3600000)) / 60000);
    var vS = Math.floor((v - (vH * 3600000) - (vM * 60000)) / 1000);
    return set2Digit(vH) + ':' + set2Digit(vM) + ':' + set2Digit(vS);
}

function set2Digit(ov) {
    var os = '0' + ov;
    return os.substr(os.length - 2, 2);
}

- 编辑 -

有了这个 html，我有时间展示：<div class="tm">00:00:00</div>

--EDIT2-- 好的，创建了一个新函数。它抓住了暂停的时间，所以从这一点开始时间应该继续：

$('#r').click(function() {
        $('#s1').hide();
        tI = setInterval("continueTimer()", 1000); //NEW
        $('#s2').show();
    });

//Test
function continueTimer() {
    divObj = document.getElementById("tm");
    tM.text(divObj.innerText);
}

目前，当这个函数被触发时，时间会暂停但不会继续......那么我该如何从这一点开始计时器呢？我想我很接近

4

2 回答 2

2

这是因为在setTimer方法中您正在创建一个new Date对象。因此，每次执行此方法时，都会占用当前时间。如果您想从计时器停止的地方继续，而不是 new Date每次都创建对象，请在计时器开始时在变量中维护开始日期，然后在setTimer方法中使用该变量。

修改下面的方法并添加一个全局变量。

var initialTime;
function setTimer() {
    tM.text(getTimeText(initialTime.getTime() - oT.getTime()));
    initialTime.setMilliseconds(1000);
}

function gameStart() {
    setBlocks();
    tM = $('#a1 div.tm');
    hS = $('#a1 div.hs');
    oT = new Date();
    initialTime = new Date();
    setTimer();
    tI = setInterval("setTimer()", 1000);
    setHs();
    $('.ht').click(hint);
    $('.b3').click(reset);
}
于 2012-01-29T22:24:54.510 回答
1

可以试试下面吗

$('#r').click(function() {
    oT = new Date(); //this will move the offset date to the resume time..
    tI = setInterval(setTimer, 1000);
});
于 2012-01-29T22:22:06.297 回答