Izvajanje časovnika odštevanja JavaScript v spletni kviz aplikaciji

V tej objavi bomo razširili aplikacijo za kviz in vanjo dodali funkcijo odštevalnika JavaScript. Druga stvar, ki jo bomo tu izvedli, je dodajanje kode, tako da bo lahko imel vsak kviz različno število vprašanj. Če prvega dela še niste prebrali, vam priporočam, da ga preberete. Lažje boste sledili tej objavi in ​​jo popolnoma razumeli.

Prvi del si lahko preberete tukaj .S tem bi lahko tudi razširili svoje karierne priložnosti kot .

JavaScript odštevalnik časa

Čas trajanja vsakega kviza je shranjen v datoteki XML kviza, prikličemo trajanje kviza in ga shranimo v uporabnikovo sejo kot atribut. Ko uporabnik odda vprašanje, tudi mi pošljemo čas krmilniku z uporabo obrazca po meri z JavaScriptom. Torej, ko pokažemo naslednje vprašanje, prikažemo pravilen preostali čas.

Ko se časovno trajanje kviza konča, se uporabniku prikaže opozorilno polje z napisom »Čas se izteče«, kviz se oceni in prikaže končni rezultat.

Poglejmo, kaj moramo doseči.

Pred vprašanji v kvizu smo dodali dve novi vrstici v datoteko XML kviza.

Java kviz (18.1.2015) 10 2 Katera je pravilna skladnja? javni razred ABC se razširi QWE razširi Študent int i = 'A' String s = 'Pozdravljeni' zasebni razred ABC 2 Kateri od naštetih a ni ključna beseda v Javi? razred vmesnik razširja abstrakcijo 3 Kaj je res o Javi? Java je specifična za platformo Java ne podpira večkratnega dedovanja Java se ne izvaja v Linuxu in Mac Java ni večnitni jezik 1 Kaj od naštetega je vmesnik? Koledar datumov, ki jih je mogoče zagnati 1 Katero podjetje je izdalo različico Java 8? Sun Oracle Adobe Google 1 Java spada pod katero kategorijo jezikov? Jeziki prve generacije Jeziki druge generacije Jeziki tretje generacije Jeziki četrte generacije 2 Kateri privzeti paket je samodejno viden vašemu programu? java.net javax.swing java.io java.lang 3 Kateri vnos v WEB-INF se uporablja za preslikavo servleta? servlet-mapping servlet-registration servlet-entry servlet-attachment 0 Kakšna je dolžina podatkovnega tipa Java int? 32-bitna 16-bitna 64-bitna specifična za izvajalno okolje 0 Kakšna je privzeta vrednost logičnega tipa podatkovnega tipa Java? true false 1 0 1

Nastavitev časovnika ob zagonu novega izpita

Ko uporabnik začne nov izpit, kot atribut nastavimo skupno število vprašanj in trajanje kviza v uporabnikovi seji.

request.getSession (). setAttribute ('totalNumberOfQuizQuestions', document.getElementsByTagName ('totalQuizQuestions'). item (0) .getTextContent ()) request.getSession (). .item (0) .getTextContent ()) request.getSession (). setAttribute ('min', document.getElementsByTagName ('quizDuration'). item (0) .getTextContent ()) request.getSession (). setAttribute ('sec ', 0)

Čas odštevanja

Časovnik moramo zmanjšati po vsaki sekundi, za to pa bomo ustvarili funkcijo Javascript, ki bo najprej poklicana, ko se naloži stran izpita, nato pa jo bomo po vsaki sekundi rekurzivno poklicali do časa odštevanja.

Javascript funkcija za odštevanje časa

var tim var min = '$ {sessionScope.min}' var sec = '$ {sessionScope.sec}' var f = new Date () funkcija customSubmit (someValue) {document.questionForm.minute.value = min document.questionForm. second.value = sec document.questionForm.submit ()} funkcija examTimer () {if (parseInt (sec)> 0) {document.getElementById ('showtime'). innerHTML = 'Preostali čas:' + min + 'Minute,' + sec + 'Sekunde' sec = parseInt (sec) - 1 tim = setTimeout ('examTimer ()', 1000)} else {if (parseInt (min) == 0 && parseInt (sec) == 0) {document.getElementById ('showtime'). innerHTML = 'Preostali čas:' + min + 'Minute,' + sek + 'Sekunde' opozorilo ('Čas se izteče') document.questionForm.minute.value = 0 document.questionForm.second.value = 0 dokument .questionForm.submit ()} if (parseInt (sec) == 0) {document.getElementById ('showtime'). innerHTML = 'Preostali čas:' + min + 'Minute,' + sec + 'Sekunde' min = parseInt (min ) - 1 sek = 59 tim = setTimeout ('examTimer ()', 1000)}}}

Kako poklicati funkcijo Javascript

Za klic te funkcije Javascript bomo uporabili atribut onload telesne oznake.

Predložitev časa kviza kontrolorju izpitov

Do zdaj smo obrazec za kviz oddajali neposredno krmilniku izpitov, zdaj pa moramo poslati parametre časovnika: minuto in sekundo tudi, da bo, ko bo krmilnik izpita prikazal naslednje vprašanje, prikazal tudi pravi preostali čas. Da bi to dosegli, smo obrazec oddali ročno z uporabo Javascripta in parametre min in sec poslali krmilniku izpitov.

kako končati program v javi -

Predložitev obrazca z uporabo Javascripta

Ko uporabnik klikne naslednji, prejšnji ali končni gumb customSubmit (), bo poklicana funkcija Javascript.

$ {izbira} 
  
0} '>
Ravnanje s časom gor
Ko se trajanje kviza konča, z drugimi besedami, ko tako minuta kot sekunda postaneta nič. Prikažemo opozorilno polje z napisom »Čas se izteče«, vrednost minute in sekunde nastavimo na nič in oddate obrazec.
if (parseInt (min) == 0 && parseInt (sec) == 0) {document.getElementById ('showtime'). innerHTML = 'Preostali čas:' + min + 'Minute,' + sec + 'Sekunde' opozorilo ('Time Gor ') document.questionForm.minute.value = 0 document.questionForm.second.value = 0 document.questionForm.submit ()}
Kodo moramo spremeniti tako, da bo izpit končan, ko bo potekel rok za izpit.
else if ('Finish Exam'.equals (action) || (minute == 0 && second == 0)) {finish = true int rezultat = exam.calculateResult (izpit) request.setAttribute (' rezultat ', rezultat) zahteva .getSession (). setAttribute ('currentExam', null) request.getRequestDispatcher ('/ WEB-INF / jsps / result.jsp'). naprej (zahteva, odgovor)}
Torej lahko izpit končate tako, da neposredno kliknete gumb za zaključek ali ko poteče časovna omejitev izpita (tako minuta kot sekunda postane nič).
To je to za to objavo. V naslednjem prispevku bomo nadalje razširili našo aplikacijo za kviz in dodali novo funkcijo, tako da bo lahko uporabnik pregledal svoje odgovore in vedel, na katera vprašanja se je zmotil in kakšni so bili pravilni odgovori.
Kot vedno lahko kodo prenesete, jo spremenite, kot želite. To je najboljši način za razumevanje kode. Če imate kakršno koli vprašanje ali zahtevo, prosimo, komentirajte spodaj.
Za prenos kode kliknite gumb za prenos.
 Imate vprašanje za nas? Prosimo, omenite to v oddelku za komentarje in se vam bomo javili. 
 Sorodne objave: 
kakšen je razred optičnega bralnika v javi