Einstellung Timer für Online-Prüfung mit Javascript und HTML

Ich versuche, einen "Timer" für meine Online-Prüfung Seite mit HTML und JavaScript, wo Sie Code unten sehen können. Aber ich habe Probleme:Einstellung Timer für Online-Prüfung mit Javascript und HTML

Problem:

a) Ich brauche die Zeit auf feste Zeit zu zeigen, wo Prüfung feste Zeit abschließen zu müssen .Wenn Prüfer nicht in der Lage ist, die Prüfung rechtzeitig fertig, dann wird die Seite sollte eine Warnmeldung über "Time up" anzeigen und die letzte Seite der Gesamtantwort zeigen, die der Benutzer versucht hat, die Note und die Uhrzeit, zu der der Benutzer die Prüfung beendet hat.

b) können wir wie folgt „Ihre linke Zeit: 1 Minuten: 53 Sekunden“ sehen zu laufen am unteren Rand meiner Seite, wo ich min = 1 .Aber es zeigen wie diese der linken Seite gehalten haben Zeit ist 0 Minuten: 59 Sekunden weil ich min = 1

gehalten habe c) Hier möchte ich die perfekte Zeit mit Stunden, Minuten und Sekunden zeigen, wo in Zukunft, wenn es Änderungen in Stunden, Minuten und Sekunden gibt.

JSFiddle: https://jsfiddle.net/fs6xaeox/

Code:

<!DOCTYPE html> 
<html> 
<head> 
<meta charset="UFT-8"> 
<link rel="stylesheet" href="menu.css"> 
<link rel="stylesheet" href="layout.css"> 


<script> 
var pos = 0, test, test_status, question, choice, choices, chA, chB, chC, correct = 0; 

var questions = [ 
     [ "Which of the following a is not a keyword in Java ?", "class", "interface", "extends", "C" ], 

    [ "Which of the following is an interface ?", "Thread", "Date", "Calender", "A" ], 

    [ "Which company released Java Version 8 ?", "Sun", "Oracle", "Adobe", "A" ], 

    [ "What is the length of Java datatype int ?", "32 bit", "16 bit", "None", "C" ], 

    [ "What is the default value of Java datatype boolean?","true","false","0","A"] 
]; 
function _(x){ 
    return document.getElementById(x); 
} 

function renderQuestion(){ 
    test = _("test"); 

    var showscore=Math.round(correct/questions.length*100); 


    if(pos >= questions.length){ 
     document.getElementById("online_start").src = "animatedthankyou.gif"; 

     test.innerHTML = "<h3>You got "+correct+" correct of "+questions.length+" questions</h3>"; 
     test.innerHTML += "<h3> Your Grade : "+showscore +"% </h3>"; 
     test.innerHTML +="<h4>Exam Finished in Time:" + sec+" Seconds</h4>"; 
     test.innerHTML += "<button onclick='EndExam()'>End the Exam</button>"; 
     _("test_status").innerHTML = "<h3>Test Completed</h3>"; 
     pos = 0; 
     correct = 0; 



     clearTimeout(tim); 
     //document.getElementById("endtime").innerHTML = "<h4>Finished Time:"+min+" Minutes :" + sec+" Seconds</h4>"; 
     document.getElementById("starttime").style.display += 'none'; 
     document.getElementById("showtime").style.display += 'none'; 
     //document.getElementById("showtime").style.display += 'block'; 


     return false; 
    } 
    _("test_status").innerHTML = "<h3>Question "+(pos+1)+" of "+questions.length+"</h3>"; 
    question = questions[pos][0]; 
    chA = questions[pos][1]; 
    chB = questions[pos][2]; 
    chC = questions[pos][3]; 
    test.innerHTML = "<h3>"+question+"</h3>"; 
    test.innerHTML += "<input type='radio' name='choices' value='A'> "+chA+"<br>"; 
    test.innerHTML += "<input type='radio' name='choices' value='B'> "+chB+"<br>"; 
    test.innerHTML += "<input type='radio' name='choices' value='C'> "+chC+"<br><br>"; 
    test.innerHTML += "<button onclick='checkAnswer()'>Next</button><br><br>"; 


} 
function checkAnswer(){ 
    choices = document.getElementsByName("choices"); 
    choice=-1; 
    for(var i=0; i<choices.length; i++){ 
     if(choices[i].checked){ 
      choice = choices[i].value; 
     } 
    } 
    if(choice == questions[pos][4]){ 
     correct++; 
    } 
    pos++; 
    renderQuestion(); 
} 

window.addEventListener("load", renderQuestion, false); 


function EndExam(){ 

location.href="Loginpage.htm"; 
} 


    var tim; 
     var showscore=Math.round(correct/questions.length*100); 
     var min = 1; 
     var sec = 60; 
     var f = new Date(); 
     function starttime() { 
      showtime(); 
      document.getElementById("starttime").innerHTML = "<h4>You started your Exam at " + f.getHours() + ":" + f.getMinutes()+"</h4>"; 
     } 
     function showtime() { 
      if (parseInt(sec) > 0) { 
       sec = parseInt(sec) - 1; 
       document.getElementById("showtime").innerHTML = "Your Left Time is :"+min+" Minutes :" + sec+" Seconds"; 
       tim = setTimeout("showtime()", 1000); 
      } 
      else { 
       if (parseInt(sec) == 0) { 
        min = parseInt(min) - 1; 
      document.getElementById("showtime").innerHTML = "Your Left Time is :"+min+" Minutes :" + sec+" Seconds"; 
        if (parseInt(min) == 0) { 
         clearTimeout(tim); 
      alert("Time Up"); 


      /*_("test_status").innerHTML = "Test Completed"; 
      test.innerHTML = "<h2>You got "+correct+" of "+questions.length+" questions correct</h2>"; 
      test.innerHTML = "<h2>You got "+showscore +"% out of "+questions.length+"</h2>"; 
      test.innerHTML = "<button onclick='EndExam()'>End the Exam</button>"; 
      pos = 0; 
      correct = 0; 
      clearTimeout(tim); 
      document.getElementById("endtime").innerHTML = "You Finished exam at Time is :"+min+" Minutes :" + sec+" Seconds"; 
      document.getElementById("starttime").style.display += 'none'; 
      document.getElementById("showtime").style.display += 'none'; 
      //document.getElementById("showtime").style.display += 'block'; 
      return false;*/ 

         window.location.href = "Loginpage.htm"; 
        } 
        else { 
         sec = 60; 
         document.getElementById("showtime").innerHTML = "Your Left Time is :" + min + " Minutes :" + sec + " Seconds"; 
         tim = setTimeout("showtime()", 1000); 
        } 
       } 

      } 
     } 




</script> 
</head> 

<body onload="starttime()" > 

<div id="Holder"> 
<div id="Header"></div> 
<div id="NavBar"> 
<nav> 
<ul> 
<li><a href="Loginpage.htm"> Login</a></li> 
<li><a href="Registrationpage.htm">Registration</a></li> 
</ul> 
</div> 


<div id="Content"> 
<div id="PageHeading"> 
<h1><marquee direction="right" behavior="alternate">All the Best</marquee></h1> 
</div> 

<div id="ContentLeft"> 
<h2></h2><br> 
<img id="online_start"> 
<br> 
<h6>Online Examination System(OES) is a Multiple Choice Questions(MCQ) based 
examination system that provides an easy to use environment for both 
Test Conducters and Students appearing for Examination.</h6> 
</div> 
<div id="ContentRight"> 
<section class="loginform_cf"> 
<table> 
    <tr> 
      <td id="test_status" style="text-align:left" ></td> 
      <td id="starttime" style="text-align:right"></td> 
    </tr> 

    <tr> 
    <td id="test" colspan="2"></td> 
    </tr> 

</table>  
<div id="showtime" ></div> 
</section> 
</div> 

</div> 


<div id="Footer">Developed by - K.P.RAJU</div> 
</div> 
</body> 
</html>

kann jede Hilfe für dieses Problem.

Quelle

2016-08-09 user3172464

bitte eine Demo – brk

aktualisiert Geige erstellen, https://jsfiddle.net/fs6xaeox/4/ totalsec eingeführt, min und sec wird aus totalsec berechnet – lordkain

Seien Sie vorsichtig, jeder kann die Antworten auf Ihre Fragen lesen. Sie müssen nur die Entwickler-Tools öffnen ..... Ich würde empfehlen, die Überprüfung der richtigen Antwort auf der Serverseite zu tun, und die Überprüfung einer richtigen Antwort pro Benutzer auf einmal zu begrenzen. – LEDfan

Zunächst einmal, Sie könnten besser entweder mit PHP oder mit einem Programm für den Testaufbau sein. Das liegt einfach daran, dass ich den Timer austricksen kann, indem ich entweder meine eigene verbleibende Zeit einstelle oder den Zeitabschnitt umgebe. Und vertraue mir als Student, wenn ich sage, dass, wenn das entdeckt wird, du deine Tests buchstäblich nie bekommen wirst.

Hier geben Sie an, dass sie nur noch 60 Sekunden übrig, wie Sie den Wert sec aufrufen, wenn die Zeit anzeigt, und nicht die tatsächliche aktuelle Zeit

  else { 
       sec = 60;

Vermeintliche Zeit sein?

tim = setTimeout("....

Ich habe auch andere Dinge verpasst haben, so und ich komme wieder sagen, wenn ich irgendeine Art und Weise hilfreich

war

Quelle

2016-08-09 05:29:10 4g0tt3nSou1

Vielleicht möchten Sie auch einen "Unanswered" -Wert hinzufügen, falls sie nicht rechtzeitig abgeschlossen werden. Und um die Antworten, die Noten, die Startzeit (vielleicht sogar das Datum) und die Zeit (Datum) zu erhalten, sollten Sie die Daten in einer MySQL-Datenbank speichern, die von den meisten WebHosts angeboten wird – 4g0tt3nSou1

Stellen Sie auch Ihre Seitenweiterleitungen ein Wenn diese Datei nicht innerhalb des gleichen Verzeichnisses auf Ihrem Webserver ausgeführt wird, werden 404-Fehler zurückgegeben. Und können Sie besser "C" – 4g0tt3nSou1

nur um sicher Beachten Sie, dass jeder sein kann, die Zeit hier und sehen vollständige Antworten manipulieren. Wenn dies nur ein Vorab-Check für die Teilnahme an einem Kurs ist, dann ist dies ein "guter" Weg. Aber benutze das nicht für Live-Prüfungen.

A, show time

nutzen Bibliothek abzuschließen Sekunden hinzuzufügen und so

var showcurtime = moment(); 
    var curtimeformat = showcurtime.format('h:mm:ss a'); 
    var showendtime = showcurtime.add(totalsec, 's'); 
    var endtimeFormat = showendtime.format('h:mm:ss a'); 

    console.log(curtimeformat); 
    console.log(endtimeFormat);

B, show time

Gesamtzeit links angezeigt halten und Subtrahieren im Beginn der Funktion showtime()

C-Format Zeit

Ich schlage vor, Sie verwenden Moment.js, um die Zeit zu formatieren. erfinde das Rad nicht neu. um die Zeit anzuzeigen können Sie diese Syntax

moment().format('h:mm:ss a');

verwende ich passen Sie Ihre Geige hier

https://jsfiddle.net/fs6xaeox/13/

Quelle

2016-08-09 06:17:38 lordkain

Hi umformulieren. Danke, dass du dem Timer-Problem geholfen hast. Die folgende Funktionalität funktioniert jedoch nicht richtig. Es wird nicht die Startzeit und die Endzeit angezeigt. also hilf mir beide – user3172464

Funktion starttime() { showtime(); var showcurtime = Moment(). Format ('h: mm: ss a'); \t \t var curtimeformat = showcurtime.format ('h: mm: ss a'); \t \t var showendtime = showcurtime.add (Gesamtsec, 's'); \t \t var endtimeFormat = showendtime.format ('h: mm: ss a'); \t \t document.getElementById ("Startzeit"). InnerHTML = "

Sie haben Ihre Prüfung unter" + curtimeformat + "

gestartet"; \t \t document.getElementById ("endtime"). InnerHTML = "

Sie sollten Ihre Prüfung bei" + endtimeFormat + "

beenden"; \t \t \t \t \t \t } – user3172464

in der Geige Sie die Start- und Endzeit sehen tun, passen i Geige Endzeit auf anderen Zeilen setzen – lordkain

Einstellung Timer für Online-Prüfung mit Javascript und HTML

Antwort

Sie haben Ihre Prüfung unter" + curtimeformat + "

Sie sollten Ihre Prüfung bei" + endtimeFormat + "

Verwandte Themen