Implementació del temporitzador de compte enrere JavaScript en una aplicació de prova en línia

En aquesta publicació ampliarem la nostra aplicació de prova i hi afegirem una funció de temporitzador de compte enrere JavaScript. Una altra cosa que implementarem aquí és afegir codi perquè cada qüestionari pugui tenir un nombre diferent de preguntes. Si encara no heu llegit la primera part, us recomano que la passeu. Us serà més fàcil seguir aquesta publicació i entendre-la completament.

Podeu llegir la primera part aquí .També podríeu ampliar les vostres oportunitats de carrera Angular .

Temporitzador de compte enrere JavaScript

La durada del temps de cada qüestionari s’emmagatzema al fitxer XML del test, recuperem la durada del test i el guardem a la sessió de l’usuari com a atribut. Quan l’usuari envia una pregunta, també enviem l’hora al controlador mitjançant l’enviament de formularis personalitzats amb JavaScript. Per tant, quan mostrem la següent pregunta, mostrarem el temps restant correcte.

Quan finalitzi la durada del test, a l'usuari se li mostrarà un quadre d'alerta que diu 'Time Up' i el test s'avaluarà i es mostrarà el resultat final.

Vegem què necessitem per aconseguir-ho.

Hem afegit dues línies noves al fitxer XML quiz abans de les preguntes.

Quiz de Java (01/01/2015) 10 2 Quina és la sintaxi correcta? public class ABC extends QWE extends Student int i = 'A' String s = 'Hello' private class ABC 2 Quin dels següents a no és una paraula clau a Java? interfície de classe amplia l'abstracció 3 Què hi ha de cert en Java? Java és específic de la plataforma Java no admet herències múltiples Java no s'executa a Linux i Mac Java no és un llenguatge de diversos fils 1 Quin dels següents és una interfície? Thread Runnable Date Calendar 1 Quina empresa va llançar la versió 8 de Java? Quina categoria d'idiomes pertany a Sun Oracle Adobe Google 1 Java? Idiomes de primera generació Idiomes de segona generació Idiomes de tercera generació Idiomes de quarta generació 2 Quin és el paquet per defecte que és visible automàticament pel vostre programa? java.net javax.swing java.io java.lang 3 Quina entrada de WEB-INF s'utilitza per assignar un servlet? servlet-mapping servlet-recording servlet-entry servlet-attachment 0 Quina és la longitud del tipus de dades Java? 32 bits 16 bits 64 bits Temps d'execució específic 0 Quin és el valor per defecte del tipus de dades booleà Java? veritable fals 1 0 1

Configuració del temporitzador en iniciar un nou examen

Quan l'usuari comença un nou examen, establim el total de preguntes i la durada del qüestionari a la sessió de l'usuari com a atribut.

com analitzar el fitxer XML a Java

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

Temps de compte enrere

Hem de decrementar el temporitzador després de cada segon, per fer-ho, crearem una funció Javascript que es cridarà primer quan es carregui la pàgina d’examen i, després, cridarem aquesta funció de forma recursiva després de cada segon fins al temps de compte enrere.

Funció Javascript fins al temps de compte enrere

var tim var min = '$ {sessionScope.min}' var sec = '$ {sessionScope.sec}' var f = new Date () function customSubmit (someValue) {document.questionForm.minute.value = min document.questionForm. second.value = sec document.questionForm.submit ()} funció examTimer () {if (parseInt (sec)> 0) {document.getElementById ('showtime'). innerHTML = 'Temps restant:' + min + 'Minuts,' + sec + 'Seconds' sec = parseInt (sec) - 1 tim = setTimeout ('examTimer ()', 1000)} else {if (parseInt (min) == 0 && parseInt (sec) == 0) {document.getElementById ('showtime'). innerHTML = 'Temps restant:' + min + 'Minuts,' + sec + alerta 'Segons' ('Time Up') document.questionForm.minute.value = 0 document.questionForm.second.value = 0 document .questionForm.submit ()} if (parseInt (sec) == 0) {document.getElementById ('showtime'). innerHTML = 'Temps restant:' + min + 'Minuts,' + sec + 'Seconds' min = parseInt (min ) - 1 s = 59 tim = setTimeout ('examTimer ()', 1000)}}}

Com trucar a la funció Javascript

Ara, per anomenar aquesta funció Javascript, farem servir l'atribut onload de l'etiqueta corporal.

Enviament del temps de prova al controlador de l’examen

Fins ara enviavem el formulari de preguntes del qüestionari directament al controlador d’exàmens, però ara hem d’enviar els paràmetres del temporitzador: minut i segon, de manera que, quan el controlador d’exàmens mostri la següent pregunta, també ha de mostrar el temps restant correcte. Per aconseguir-ho, hem enviat el formulari manualment mitjançant Javascript i hem enviat els paràmetres mínims i segons al controlador d’exàmens.

què és un desenvolupador de blockchain

Enviament del formulari mitjançant Javascript

Tingueu en compte que quan l’usuari faci clic al botó següent, anterior o finalitzar es cridarà a la funció Javascript customSubmit ().

$ {choice} 
  
0} '>
Manejar el temps
Quan s’acabi la durada del qüestionari, és a dir, quan el minut i el segon es converteixen en zero. Mostrem un quadre d’alerta que diu 'Time Up' i establim el valor de minut i segon a zero i enviem el formulari.
if (parseInt (min) == 0 && parseInt (sec) == 0) {document.getElementById ('showtime'). innerHTML = 'Temps restant:' + min + 'Minuts,' + sec + alerta 'Segons' ('Time Puja ') document.questionForm.minute.value = 0 document.questionForm.second.value = 0 document.questionForm.submit ()}
Hem de canviar el codi perquè l’examen finalitzi quan s’acabi el límit de temps per a l’examen.
else if ('Finalitza l'examen'. equals (acció) || (minut == 0 && segon == 0)) {finish = true int result = exam.calculateResult (examen) request.setAttribute ('result', result) request .getSession (). setAttribute ('currentExam', nul) request.getRequestDispatcher ('/ WEB-INF / jsps / result.jsp'). forward (sol·licitud, resposta)}
Per tant, es pot acabar un examen fent clic directament al botó Finalitzar o quan s’acabi el límit de temps de l’examen (el minut i el segon es converteixen en zero).
Això és tot per a aquesta publicació. A la propera publicació ampliarem encara més la nostra sol·licitud de prova i afegirem una nova funció perquè l’usuari pugui revisar les seves respostes i saber quines preguntes s’ha equivocat i quines van ser les respostes correctes.
Com sempre, podeu descarregar el codi, canviar-lo com vulgueu. Aquesta és la millor manera d’entendre el codi. Si teniu alguna pregunta o sol·licitud, comenteu-ho a continuació.
Feu clic al botó de descàrrega per descarregar el codi.
 Tens alguna pregunta? Esmenta’l a la secció de comentaris i et respondrem. 
 Articles Relacionats: 
  
obtenir data des de string java