Question

感谢您的光临。

我一直在尝试向正在开发的项目中添加功能部件，但是我无法忍受。

项目加载后，我希望用户在移动或单击其中一个球体时立即激活时间，而不是在项目加载后立即激活。我知道有一个onClick或click事件，但是我无法在js代码上实现它。我已经将所有功能都注释掉或“灰化”以进行测试。

以下是一些时间代码：

function clockStart() {
    numberOfSecs = setInterval(function () {
        seconds.text(`${second}`)
        second = second + 1
    }, 1000);
}

function rewindSec(seconds) {
    if (seconds) {
        clearInterval(seconds);
    }
}

gameStart();

// GAMES BEGIN!!!
function gameStart() {
    var cards = shuffle(listOfCards);
    deckOfCards.empty();
    match = 0;
    Moves = 0;
    moveNum.text("0");
    ratingStars.removeClass("fa-angry").addClass("fa-star");
    for (var i = 0; i < cards.length; i++) {
        deckOfCards.append($('<li class="card"><i class="fab fa-' + cards[i] + '"></i></li>'))
    }
    sourceCard();

    rewindSec(numberOfSecs);
    second = 0;
    seconds.text(`${second}`)
    clockStart();
};

以下是我正在谈论的项目的链接：

全页查看：https://codepen.io/idSolomon/full/RYPZNp/

编辑器视图：https://codepen.io/idSolomon/pen/RYPZNp/?editors=0010

警告：项目不适用于移动设备。至少还没有。

如果有人可以帮助我，一千个谢谢您。

谢谢！

Answer 1

您可以更改在其他位置启动时钟的事件

首先从 gameStart（）方法

中删除 clockStart（）函数。

seconds.text(`${second}`)
//clockStart();

如果添加了Extra变量以检测时钟是否启动

var isClockStarted=false;

单击卡时，以下代码将启动计时器：

var sourceCard = function () {

deckOfCards.find(".card").bind("click", function () {
if(!isClockStarted)
clockStart();

波纹管代码将检查计时器是否已启动。

function clockStart() {
if(!isClockStarted){
    isClockStarted=true;
numberOfSecs = setInterval(function () {
    seconds.text(`${second}`)
    second = second + 1
}, 1000);

} }

我发现即使游戏结束，您也不会停止计时

如果取消游戏，它将再次启动计时器// toCheck

试图使时钟功能点击

1 个答案: