Implementacija JavaScript odbrojavanja u internetsku aplikaciju za kviz

U ovom ćemo postu proširiti našu kviz aplikaciju i dodati ćemo joj funkciju odbrojavanja JavaScript vremena. Druga stvar koju ćemo ovdje implementirati je dodavanje koda kako bi svaki kviz mogao imati različit broj pitanja. Ako već niste pročitali prvi dio, preporučit ću vam da ga prođete. Bit će vam lakše pratiti ovaj post i u potpunosti ga razumjeti.

Prvi dio možete pročitati ovdje .Također biste mogli proširiti svoje mogućnosti karijere u kutnom obliku .

JavaScript odbrojavanje vremena

Trajanje svakog kviza pohranjeno je u XML datoteci kviza, dohvaćamo trajanje kviza i spremamo ga u korisničku sesiju kao atribut. Kada korisnik pošalje pitanje, mi također predajemo vrijeme kontroloru pomoću prilagođenog slanja obrazaca s JavaScriptom. Dakle, kada pokažemo sljedeće pitanje, prikazujemo točno preostalo vrijeme.

Kad vremensko trajanje kviza završi, korisniku će se prikazati okvir s upozorenjem 'Vrijeme je isteklo', kviz će se procijeniti i prikazati konačni rezultat.

Pogledajmo što nam je potrebno da to postignemo.

Prije pitanja u kvizu dodali smo dva nova retka u XML datoteku kviza.

Java kviz (18.1.2015.) 10 2 Koja je točna sintaksa? javna klasa ABC proširuje QWE proširuje Student int i = 'A' String s = 'Pozdrav' privatna klasa ABC 2 Što od navedenog a nije ključna riječ u Javi? sučelje klase proširuje apstrakciju 3 Što je istina o Javi? Java je specifična za platformu Java ne podržava višestruko nasljeđivanje Java se ne izvodi na Linuxu i Mac Java nije jezik s više niti 1 Što je od navedenog sučelje? Kalendar datuma koji se može izvoditi u niti 1 Koja je tvrtka objavila Javu verziju 8? Sun Oracle Adobe Google 1 Java spada pod koju kategoriju jezika? Jezici prve generacije Jezici druge generacije Jezici treće generacije Jezici četvrte generacije 2 Koji je zadani paket koji je automatski vidljiv vašem programu? java.net javax.swing java.io java.lang 3 Koji se unos u WEB-INF koristi za mapiranje servleta? servlet-mapping servlet-registration servlet-entry servlet-attachment 0 Kolika je duljina Java tipa podataka int? 32-bitna 16-bitna 64-bitna specifična za vrijeme izvođenja 0 Koja je zadana vrijednost logičkog tipa podataka Java? true false 1 0 1

Postavljanje tajmera prilikom pokretanja novog ispita

Kada korisnik započne novi ispit, postavljamo ukupna pitanja i trajanje kviza u korisničkoj sesiji kao atribut.

jednostavna implementacija hashmapa u javi

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)

Vrijeme odbrojavanja

Moramo dekrementirati tajmer nakon svake sekunde, da bismo to napravili, stvorit ćemo Javascript funkciju koja će se prvo pozvati kad se učita stranica ispita, a zatim ćemo je pozvati rekurzivno nakon svake sekunde do vremena odbrojavanja.

Javascript funkcija za odbrojavanje vremena

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 = 'Preostalo vrijeme:' + min + 'Minute,' + sec + 'Sekunde' sec = parseInt (sec) - 1 tim = setTimeout ('examTimer ()', 1000)} else {if (parseInt (min) == 0 && parseInt (sec) == 0) {document.getElementById ('showtime'). innerHTML = 'Preostalo vrijeme:' + min + 'Minute,' + sec + upozorenje 'Sekunde' ('Vrijeme je isteklo') document.questionForm.minute.value = 0 document.questionForm.second.value = 0 dokument .questionForm.submit ()} if (parseInt (sec) == 0) {document.getElementById ('showtime'). innerHTML = 'Preostalo vrijeme:' + min + 'Minute,' + sec + 'Sekunde' min = parseInt (min ) - 1 sek = 59 tim = setTimeout ('examTimer ()', 1000)}}}

Kako nazvati Javascript funkciju

Sada, da bismo pozvali tu funkciju Javascript, koristit ćemo atribut onload tjelesne oznake.

Predaja vremena za kviz kontroloru ispita

Do sada smo obrazac za kviz predavali izravno kontroloru ispita, ali sada moramo poslati parametre odbrojavanja: minutu i sekundu, tako da kada kontrolor ispita prikaže sljedeće pitanje, također bi trebalo prikazati točno preostalo vrijeme. Da bismo to postigli, ručno smo poslali obrazac pomoću Javascripta i parametre min i sec poslali kontroloru ispita.

kako izbjeći mrtve točke u javi -

Slanje obrasca pomoću Javascripta

Imajte na umu da će se kada korisnik klikne na sljedeću, prethodnu ili završnu tipku customSubmit () funkcija Javascript pozvati.

$ {izbor} 
  
0} '>
Rukovanje vremenom
Kada završi trajanje kviza, drugim riječima kada i minuta i sekunda postanu nula. Prikazujemo okvir upozorenja s porukom „Vrijeme je isteklo“ i vrijednost minute i sekunde postavljamo na nulu i predajemo obrazac.
if (parseInt (min) == 0 && parseInt (sec) == 0) {document.getElementById ('showtime'). innerHTML = 'Preostalo vrijeme:' + min + 'Minute,' + sec + 'Sekunde' upozorenje ('Time Gore ') document.questionForm.minute.value = 0 document.questionForm.second.value = 0 document.questionForm.submit ()}
Moramo promijeniti kôd tako da će ispit biti završen kad istekne vremensko ograničenje za ispit.
else if ('Finish Exam'.equals (action) || (minute == 0 && second == 0)) {finish = true int rezultat = exam.calculateResult (ispit) request.setAttribute (' rezultat ', rezultat) zahtjev .getSession (). setAttribute ('currentExam', null) request.getRequestDispatcher ('/ WEB-INF / jsps / result.jsp'). prosljeđivanje (zahtjev, odgovor)}
Dakle, ispit se može završiti ili klikom na gumb za završetak izravno ili kada vremensko ograničenje ispita istekne (i minuta i sekunda postaju nula).
To je to za ovaj post. U sljedećem postu dodatno ćemo proširiti našu aplikaciju za kviz i dodati novu značajku tako da će korisnik moći pregledati svoje odgovore i znati na koja je pitanja pogrešno shvatio i koji su točni odgovori.
Kao i uvijek možete preuzeti kod, promijenite ga kako želite. To je najbolji način za razumijevanje koda. Ako imate bilo kakvo pitanje ili zahtjev, molimo komentirajte u nastavku.
Kliknite gumb za preuzimanje da biste preuzeli kod.
 Imate pitanje za nas? Molimo spomenite to u odjeljku za komentare i javit ćemo vam se. 
 Vezane objave: 
  
zadana vrijednost java char polja