2017-06-01 2 views
0

Ich mache ein Quiz-Spiel für ein Projekt in HTML und JavaScript. Bei jeder Frage hat der Spieler 15 Sekunden Zeit zu antworten. Ich schaffe dies damit zu tun:JavaScript Timer für ein Quiz

<body onload="setTimeout(Timer,15000)"> 

und dann in Js:

function Timer() 
    { 
     alert("You are out of time!"); 
    } 

Das Teil funktioniert gut, aber was ich wissen will, ist es eine Möglichkeit, die ich in einem <p> Tag drucken konnten, wie viel Zeit hat ein Spieler?

+1

Suche nach setInterval –

+2

Suche nach "Timer Countdown"; Es gibt viele, viele Fragen über sie. –

+0

Möglich Duplizieren https://stackoverflow.com/questions/20618355/the-simplet-possible-javascript-countdown-timer –

Antwort

3

<div id="count">Start</div>

var count = 15; 
var interval = setInterval(function(){ 
    document.getElementById('count').innerHTML=count; 
    count--; 
    if (count === 0){ 
    clearInterval(interval); 
    document.getElementById('count').innerHTML='Done'; 
    // or... 
    alert("You're out of time!"); 
    } 
}, 1000); 
1

Hier ist ein einfaches Beispiel eines Countdown-Timer

var count = 15; 
var timer = setInterval(function() { 
    console.log(count); 
    count--; 
    if(count === 0) { 
    stopInterval() 
    } 
}, 1000); 

var stopInterval = function() { 
    console.log('time is up!'); 
    clearInterval(timer); 
} 

Repl: https://repl.it/I2C6

0

die Variable initialisieren 's' mit Timeout-Zeit in Sekunden. Aufruf setInterval() mit 2 Parametern, 1. ist der Methodenname und 2. Parameter ist das Intervall zwischen dem Aufruf der im 1. Parameter genannten Methode.

var sec = 15; 
 
var time = setInterval(myTimer, 1000); 
 

 
function myTimer() { 
 
    document.getElementById('timer').innerHTML = sec + "sec left"; 
 
    sec--; 
 
    if (sec == -1) { 
 
     clearInterval(time); 
 
     alert("Time out!! :("); 
 
    } 
 
}
Time : <span id="timer"></span>