2016-12-02 10 views
0

数回のラウンド後にカウントダウンを停止するにはどうすればよいですか?

var secondsP = document.getElementById('seconds'); 
 
var btn1 = document.getElementById("btnSurrender"); 
 
var clock = null; 
 

 
btn1.addEventListener("click", surrender); 
 

 
function timer() { 
 

 
clearInterval(clock); 
 

 
var start = new Date().getTime(); 
 

 
clock = setInterval(function() { 
 

 

 

 

 
     var seconds = Math.round(15 - (new Date().getTime() - start)/1000); 
 

 

 
     if (seconds >= 0) { 
 
      secondsP.textContent = seconds; 
 
     } else { 
 
      clearInterval(clock); 
 
     } 
 

 
     if (seconds === 0) { 
 

 

 
     } 
 
}, 1000); 
 
} 
 

 

 

 
function surrender(){ 
 

 
clearInterval(clock); 
 
secondsP.textContent = 0; 
 
setTimeout(timer,2000); 
 
} 
 

 

 
timer(); 
 
setInterval(timer, 17000);
<html> 
 
<head> 
 
<style> 
 

 
</style> 
 
<script src="/scripts/snippet-javascript-console.min.js?v=1"></script> 
 
</head> 
 
<body> 
 
<p id="seconds">15</p> 
 
<button id= "btnSurrender">end now</button> 
 

 
</body> 
 
</html>

私は私の小さな問題で助けを必要としています。私は15秒間カウントダウンするストップウォッチを作った。この15秒後、2秒間待ってから再び開始します。 「今すぐ終了」ボタンを使用してカウントを停止するオプションがあります(2秒後に再び開始されます)。さて、私の質問は、どのように3/4ラウンド後に全カウントを停止する機能を作ることができますか?

+0

をあなただけのループ内の関数を入れて、反復を数えることができませんでしたか? – PurpleSmurph

答えて

0

setTimeout(timer, 2000)を使用して時計を再起動します。あなたがする必要があるのは、タイマーを何回実行したかを制御する変数をテストする機能の中にif statementを追加してから、それに応じてtimer()を呼び出します。 https://jsfiddle.net/L38q6k5d/が、ちょうどあなたにそれがどのように動作するかのアイデアを与えるために:ここでの実施例である

のjsファイルの先頭に:

surrender関数の内部
var timesRun = 0 
var timerInterval = null; 

timesRun += 1 // Increment it each time the timer ends 
if (timesRun > 4) { // If the timer has run less than 4 times 
    return; // this will stop the function here, so we dont start the timer again 
}  
setTimeout(timer, 2000); // Reset the timer 
timer関数の内部

if (timesRun > 1) { 
    clearInterval(timerInterval); 
    return; // end the function here 
} 
timer(); 
timerInterval = setInterval(timer, 17000); 

コンプリートJS:最初のタイマー起動するとは

var secondsP = document.getElementById('seconds'); 
var btn1 = document.getElementById("btnSurrender"); 
var clock = null; 
var timerInterval = null; 
// New Code 
var numberOfTimesRun = 0; // this is where we keep track of how many times the timer has run 

btn1.addEventListener("click", surrender); 

function timer() { 
    clearInterval(clock); 

    // New Code 
    if (numberOfTimesRun > 1) { 
    clearInterval(timerInterval); 
    return; // end the function here 
    } 
    // End New Code 

    var start = new Date().getTime(); 

    clock = setInterval(function() { 

    var seconds = Math.round(15 - (new Date().getTime() - start)/1000); 

    if (seconds >= 0) { 
     secondsP.textContent = seconds; 
    } else { 
     clearInterval(clock); 
     numberOfTimesRun += 1; // so we know that 1 iteration of the timer has been completed 
    } 

    if (seconds === 0) { 
    } 

    }, 1000); 
} 



function surrender(){ 
    clearInterval(clock); 
    secondsP.textContent = 0; 
    //New Code 
    numberOfTimesRun += 1; 
    if (numberOfTimesRun > 4) { 
    return; // end the function there 
    } 
    setTimeout(timer, 2000) 
    //End New Code 
} 


timer(); 
timerInterval = setInterval(timer, 17000); 
+0

はい、ボタンを使用してカウントを停止した場合にのみ機能します。そして、私は何が起こったか(ボタンや時間が終了する)とは関係なくそれを止めたかった。私の質問は明らかではありませんでした。申し訳ありません。 – unknown2549

+0

私の答えが変わった、あなたのためにjsfiddleも更新しました –

+0

ありがとう:) – unknown2549

関連する問題