メモリゲームの最初のカードをクリックしたときにタイマーを起動する

Question

私はプロジェクトをまとめようとしています。唯一のことは、マッチゲームをクリックしてタイマーを開始することです。タイマーは、プロジェクトが望んでいないHTMLファイルが読み込まれたときに開始され、いくつかの方法を試しましたが、ゲームがフリーズしてしまいます。私は、カードをクリックするとタイマーを起動させたい。

var open = []; 
var matched = 0; 
var moveCounter = 0; 
var numStars = 3; 
var timer = { 
    seconds: 0, 
    minutes: 0, 
    clearTime: -1 
}; 

//Start timer 
    var startTimer = function() { 
     if (timer.seconds === 59) { 
      timer.minutes++; 
      timer.seconds = 0; 
     } else { 
      timer.seconds++; 
    }; 


    // Ensure that single digit seconds are preceded with a 0 
    var formattedSec = "0"; 
     if (timer.seconds < 10) { 
      formattedSec += timer.seconds 
     } else { 
      formattedSec = String(timer.seconds); 
     } 

     var time = String(timer.minutes) + ":" + formattedSec; 
     $(".timer").text(time); 
    }; 

これは、カードをクリックするためのコードです。私はこれにstartTimerコードを含めることを試みましたが、うまくいきません。私のHTMLファイルの

var onClick = function() { 
    if (isValid($(this))) { 

     if (open.length === 0) { 
      openCard($(this)); 

     } else if (open.length === 1) { 
      openCard($(this)); 
      moveCounter++; 
      updateMoveCounter(); 

      if (checkMatch()) { 
       setTimeout(setMatch, 300); 

      } else { 
       setTimeout(resetOpen, 700); 

      } 
     } 
    } 
}; 

そして、私が使用して、このクラスコード

<span class="timer">0:00</span> 

Answer 1

これを試してみてください：https://codepen.io/anon/pen/boWQbe

あなたが行うために必要なすべては、ページの読み込み時に発生した関数からresetTimer()呼び出しを削除したとその後、（カードの）onClickのチェックをして、タイマーがまだ開始しているかどうかを確認してください。 timer.seconds == 0 && timer.minutes == 0。