Reflexspiel: JavaScript-Reaktionszeittest

Im Editor öffnen Video Veröffentlichen Sie Ihren Code

HTML

<!DOCTYPE html>
<html>
<head>
    <meta name="viewport" 
          content="width=device-width, initial-scale=1.0">
    <meta charset="utf-8">
  
  <style>
  input[type=button]{    
  background-color: #77797c;
    border: none;
    border-radius: 10%;
    color: white;
    padding: 16px 32px;
    text-decoration: none;
    margin: 4px 2px;
    cursor: pointer;
}
  </style>

<title>Reflex Game</title>
</head>
<body><script language="JavaScript">

var startTime=new Date();
var endTime=new Date();
var startPressed=false;
var bgChangeStarted=false;
var maxWait=20;
var timerID;

function startTest()
{
    document.body.style.background=document.response.bgColorChange.options[
document.response.bgColorChange.selectedIndex].text;
    bgChangeStarted=true;
    startTime=new Date();
}

function remark(responseTime)
{
    var responseString="";
    if (responseTime < 0.20)
        responseString="Well done!";
    if (responseTime >= 0.30 && responseTime < 0.20)
        responseString="Nice!";
    if (responseTime >=0.40 && responseTime < 0.30)
        responseString="Could be better...";
    if (responseTime >=0.50 && responseTime < 0.60)
        responseString="Keep practicing!";
    if (responseTime >=0.60 && responseTime < 1)
        responseString="Have you been drinking?";
    if (responseTime >=1)
        responseString="Did you fall asleep?";

return responseString;
}

function stopTest()
{
    if(bgChangeStarted)
    {
        endTime=new Date();
        var responseTime=(endTime.getTime()-startTime.getTime())/1000;

var randMULTIPLIER=0x015a4e35;
var randINCREMENT=1;
var today=new Date();
var randSeed=today.getSeconds();
function randNumber()
{
    randSeed = (randMULTIPLIER * randSeed + randINCREMENT) % (1 << 31);
    return((randSeed >> 15) & 0x7fff) / 32767;
}

<br>
        <form name="response">
        Change background color to: 
        <select name="bgColorChange">
        <option selected>deeppink
        <option>aliceblue
        <option>crimson
        <option>darkkhaki
        <option>cadetblue
        <option>darkorchid
        <option>coral
        <option>chocolate
        <option>mediumslateblue
        <option>tomato
        <option>darkslategray
        <option>limegreen
        <option>cornflowerblue
        <option>darkolivegreen
        </select><br>
        <br>

</body>
</html>

Reflexspiel: JavaScript-Reaktionszeittest

HTML

CSS

JS

HTMLCopy

CSSCopy

JSCopy

HTML

CSS

JS