Yksinkertainen koodivinkki javascriptillä toteutetusta aakkostesteristä, jossa nimensä mukaisesti testataan kuinka nopeasti käyttäjä saa painettua suomalaiset aakkoset oikeassa järjestyksessä.
<html> <head> <title>Aakkostesteri</title> <script type="text/javascript"> //taulukko aakkosista var aakkoset = ["a","b","c","d","e","f","g","h","i","j","k","l","m","n","o","p","q","r","s", "t","u","v","w","x","y","z","å","ä","ö"]; //seuraavaksi painettavan kirjaimen indeksi taulukosta var indeksi = 0; //kuluneet millisekunnit ja sekunnit var millisek = 0; var sekunnit = 0; //muuttuja joka kontrolloi testerin alkamista var aloita = false; function ajastin () { //div-elementit joissa kirjain ja kulunut aika näytetään var aika = document.getElementById("aika"); var kirjain = document.getElementById("kirjain"); //korotetaan millisekuntteja yhdellä millisek += 1; //jos yksi sekuntti on kulunut if (millisek == 100) { //korotetaan sekuntteja yhdellä sekunnit += 1; //nollataan millisekunnit millisek = 0; } //päivitetään nykyisen kirjaimen ja kuluneen ajan näkymää kirjain.innerHTML = aakkoset[indeksi]; //jos testeriä ei ole vielä aloitettu if (!aloita) { aika.innerHTML = "Paina ensimmäistä kirjainta aloittaaksesi."; } else { //muuten näytetään kulunut aika aika.innerHTML = "<b>" + sekunnit + "</b>:" + millisek; } setTimeout(ajastin,1); } function painallus (e) { //otetaan talteen painettu näppäin if (e.keyCode) keycode=e.keyCode; else keycode=e.which; np = String.fromCharCode(keycode); //jos testeriä ei ole vielä aloitettu if (!aloita) { aloita = true; } //jos painetaan viimeistä kirjainta if (indeksi == 28 && np == "ö") { //näytetään tulos alert("Tuloksesi oli " + sekunnit + ":" + millisek + " sekunttia!"); //päivitetään ikkuna jotta testeri voidaan aloittaa uudelleen window.location.reload(); } //jos painettu näppäin on sama mitä seuraavaksi pitää painaa if (np == aakkoset[indeksi]) { //siirrytään seuraavaan kirjaimeen indeksi += 1; } } </script> </head> <body onload="ajastin()" onkeypress="painallus(event)"> <div id="kirjain" style="font-size:30px;"></div> <div id="aika"></div> </body> </html>
Aihe on jo aika vanha, joten et voi enää vastata siihen.