JavaScript - Can't Get Javascript Quiz To Work Properly?
Hi - would appreciate some help with this school project. I can't get this simple quiz to work correctly, it should give a pop-up with a pass/fail message on submit. Can anyone see the error?
Instead of posting the whole code - the live version is here with all the code in the doc head... http://bit.ly/hR8JYk Similar TutorialsHello I need to make an answers page for a quiz but I don't know how to do it? Code is below if it helps Code: <!DOCTYPE html> <html> <head> <title>QUIZ</title> <script> var Q = function (id, text, correct, wrong) { this.id = id; this.text = text; this.correct = correct; this.wrong = wrong; this.answers = this.correct.concat(this.wrong) } Q.prototype = { blah: function () { document.write("<p>x<\/p>"); }, write: function () { if (this.asked) { return false; } this.asked = true; document.write( '<p>' + this.text + '<\/p>'); document.write( '<form>'); var type = ( this.correct.length > 1 ? "checkbox" : "radio" ); for (var i in this.answers) { document.write( '<input type="'+type+'" name="'+this.id+'">'+this.answers[i]+'<\/input><br>'); } document.write( '<\/form>'); return true; } } var questions = [ new Q( "Q1", "Question 1", ["Correct Answer"], ["Incorrect", "Incorrect", "Incorrect"] ), new Q( "Q2", "Question 2", ["Correct Answer", "Correct Answer"], ["Incorrect", "Incorrect", "Incorrect"] ), new Q( "Q3", "Question 3", ["Correct Answer", "Correct Answer"], ["Incorrect", "Incorrect", "Incorrect"] ), new Q( "Q4", "Question 4", ["Correct Answer"], ["Incorrect", "Incorrect."] ) ]; var askQuestions = function () { var asked = 0; while (asked < 3) { var num = Math.floor( Math.random() * questions.length ); var question = questions[num]; if (question.write()) { asked++; } } }; askQuestions(); </script> <BR> <input name="Submit" type="Submit" value="How did I do?"> </body> </html> Any suggestions? Thanks Hi, I am looking for a javascript quiz script that will allow me to grade individual sections of a quiz rather than grading the quiz as a whole. I am looking to setup an online test consisting of a number of sections but the output must grade each section individually. Any help apprecaited! first of all, heres my body code (dont mind the questions, theyre in greek): Code: <form name="htmltest" onSubmit="return check1() && check2() && check3() && check4() && check5() && check6() && results()"> <b>1) Τι σημαίνει HTML?</b><br> <input type="radio" name="q1" value="a" onclick="score[1]=0">a) Home Tool Markup Language<br> <input type="radio" name="q1" value="b" onclick="score[1]=0">b) Hyperlinks and Text Markup Language<br> <input type="radio" name="q1" value="c" onclick="score[1]=1">c) Hyper Text Markup Language<br> <b>2) Διάλεξε το σωστό HTML tag για την μεγαλύτερη επικεφαλίδα:</b><br> <input type="radio" name="q2" value="a" onclick="score[2]=0">a) < h6 ><br> <input type="radio" name="q2" value="b" onclick="score[2]=0">b) < head ><br> <input type="radio" name="q2" value="c" onclick="score[2]=1">c) < h1 ><br> <b>3) Ποιο είναι το σωστό HTML tag για line break?</b><br> <input type="radio" name="q3" value="a" onclick="score[3]=0">a) < break ><br> <input type="radio" name="q3" value="b" onclick="score[3]=0">b) < lb ><br> <input type="radio" name="q3" value="c" onclick="score[3]=1">c) < br ><br> <b>4) Διάλεξε το σωστό HTML tag για να κάνεις bold κάποια γράμματα:</b><br> <input type="radio" name="q4" value="a" onclick="score[4]=0">a) < bold ><br> <input type="radio" name="q4" value="b" onclick="score[4]=1">b) < b ><br> <input type="radio" name="q4" value="c" onclick="score[4]=0">c) < text.bold ><br> <b>5) Ποιος είναι ο σωστός τρόπος για να δημιουργήσετε έναν υπερσύνδεσμο;</b><br> <input type="radio" name="q5" value="a" onclick="score[5]=0">a) < a url="http://www.unipi.gr">Unipi.gr < / a><br> <input type="radio" name="q5" value="b" onclick="score[5]=1">b) < a href="http://www.unipi.gr">Unipi.gr< / a><br> <input type="radio" name="q5" value="c" onclick="score[5]=0">c) < a >http://www.unipi.gr"< / a><br> <b>6) Ποια απο τα παρακάτω HTML tag απευθύνονται όλα σε πίνακα?</b><br> <input type="radio" name="q6" value="a" onclick="score[6]=0">a) < table >, < head >, < tfoot ><br> <input type="radio" name="q6" value="b" onclick="score[6]=0">b) < table >, < tr >, < tt ><br> <input type="radio" name="q6" value="c" onclick="score[6]=1">c) < table >, < tr> , < td ><br> <input type="submit" value="Αξιολόγηση"> <input type="reset" value="Reset"><br><br> </form> and here's my javascript code Code: function check1() { var radio_choice=false; for (counter=0; counter < htmltest.q1.length; counter++) { if (htmltest.q1[counter].checked ) radio_choice=true; } if (!radio_choice) { alert("Παρακαλώ απαντήστε σε όλες τις ερωτήσεις") return (false); } return(true); } function check2() { var radio_choice=false; for (counter=0; counter < htmltest.q2.length; counter++) { if (htmltest.q2[counter].checked ) radio_choice=true; } if (!radio_choice) { alert("Παρακαλώ απαντήστε σε όλες τις ερωτήσεις") return (false); } return(true); } function check3() { var radio_choice=false; for (counter=0; counter < htmltest.q3.length; counter++) { if (htmltest.q3[counter].checked ) radio_choice=true; } if (!radio_choice) { alert("Παρακαλώ απαντήστε σε όλες τις ερωτήσεις") return (false); } return(true); } function check4() { var radio_choice=false; for (counter=0; counter < htmltest.q4.length; counter++) { if (htmltest.q4[counter].checked ) radio_choice=true; } if (!radio_choice) { alert("Παρακαλώ απαντήστε σε όλες τις ερωτήσεις") return (false); } return(true); } function check5() { var radio_choice=false; for (counter=0; counter < htmltest.q5.length; counter++) { if (htmltest.q5[counter].checked ) radio_choice=true; } if (!radio_choice) { alert("Παρακαλώ απαντήστε σε όλες τις ερωτήσεις") return (false); } return(true); } function check6() { var radio_choice=false; for (counter=0; counter < htmltest.q6.length; counter++) { if (htmltest.q6[counter].checked ) radio_choice=true; } if (!radio_choice) { alert("Παρακαλώ απαντήστε σε όλες τις ερωτήσεις") return (false); } return(true); } var score = new Array; function results() { var i, total; total = 0; for(i=1;i<=6;i++) { total += score[i]; } window=window.open("resultshtml.html","answers","width=400px,height=700px"); document.write(total); } what i want is, first of all an easier way to get an alert if not all questions are answered because mine (6 different functions) is a bit long. Also, when you press submit, a new window must pop up (not an alert box) with your score and the correct answers. I managed to get the window to pop up but i cant make it show the variable "total" value which contains the score (from the function "results"). Any ideas? Ultimately, when the user inputs their name in a text field, choose their age from a select list, and choose the amount of hours they sleep via radio button and when they hit the submit button it is supposed to calculate the amount of years they've slept their entire life. Any hints or clues why this isn't working would be greatly appreciated. Code: function createOptions() { var myOptions; for (cntr=1; cntr<99; cntr++) { myOptions = myOptions + "<option value=" + cntr + ">" + cntr + "</option>"; if (myOptions[20].selected) { switch(myOptions[20].value) } } } function someFunction() { var myTextElement = document.getElementById("name"); var myValue = myTextElement.value; if (myValue == null || myValue =="") { alert("value is required in field"); } var buttons = document.getElementById("hours"); if (document.getElementById("r7").checked) { myHours = 7; } if (document.getElementById("r8").checked) { myHours = 8; } if (document.getElementById("r9").checked) { myHours = 9; } if (document.getElementById("r6").checked) { myHours = 6; } var mySelect = document.getElementById('age').selectmySelect.options; for (var i = 0; i < mySelect.length; i++) { if (mySelect[i].selected) { switch(mySelect[i].value) { case "1" : mySelect[i + 1].selected = true; break; case "2" : mySelect[i + 1].selected = true; break; case "3" : mySelect[i + 1].selected = true; break; } } } mySelect.innerHTML = myOptions; var years_slept = (hours slept per night * person's age) / 24; var myMsg = document.getElementById("mymsg"); } Can someone please help me with my validation! I am a novice at Javascript and have started only learning it now as its a part of my course. I know its too long but i just put in the whole thing as the error might be anywhere. Code: <html> <head> <meta name="author" content="Trev - Cert IV in IT- Networking" /> <title>Univeristy Registration Form</title> <script language="javascript" type="text/javascript"> function Mainfunc() { var Fname = new Object(); var fn = new String(); Fname = document.getElementById ("text1"); fn=Fname.value; var Mname = new Object(); var mn = new String(); Mname = document.getElementById ("text2"); mn=Mname.value; var Lname = new Object(); var ln = new String(); Lname = document.getElementById ("text3"); ln=Lname.value; var Radd = new Object(); var radd = new String(); Radd = document.getElementById ("tarea1"); radd=Radd.value; var Dd = new Object(); var dd = new String(); Dd = document.getElementById ("text4"); dd=Dd.value; var ddd = parseInt (dd,10); if (dd!=ddd) { alert ("Please enter your Date of Birth!"); return false; } var Mm = new Object(); var mm = new String(); Mm = document.getElementById ("text5"); mm=Mm.value; var mmm = parseInt (mm,10); if (mm!=mmm) { alert ("Please enter your Month of Birth!"); return false; } var Yy = new Object(); var yy = new String(); Yy = document.getElementById ("text6"); yy=Yy.value; var yyy = parseInt (yy,10); if (yy!=yyy) { alert ("Please enter your Year of Birth!"); return false; } var Rphone = new Object(); var rp = new String(); Rphone = document.getElementById ("text7"); rp=Rphone.value; var rpp = parseInt (rp,10); if (rp!=rpp) { alert ("Please enter a valid Phone number!"); return false; } var Mphone = new Object(); var mp = new String(); Mphone = document.getElementById ("text8"); mp=Mphone.value; var mpp = parseInt (mp,10); if (mp!=mpp) { alert ("Please enter a valid Mobile number!"); return false; } var Course = new Object(); var course = new String(); Course = document.getElementById ("text9"); course=Course.value; var rad1; rad1=document.getElementById("radio1"); var rad2; rad2=document.getElementById("radio2"); var sel=document.getElementById("dept").value; var radgender; var chk1 = false; var chk2 = false; var chk3 = false; var rad1chk = false; var rad2chk = false; var genderpic; var chkbox1 = new Object(); chkbox1=document.getElementById("check1"); var chkbox2 = new Object(); chkbox2=document.getElementById("check2"); var chkbox3 = new Object(); chkbox3=document.getElementById("check3"); chk1 = chkbox1.checked; chk2 = chkbox2.checked; chk3 = chkbox3.checked; rad1chk = rad1.checked; rad2chk = rad2.checked; if ((rad1chk==false)&&(rad2chk==false)) { alert("Please select a gender!"); return false; } else if (rad1chk==true) { radgender = "Male"; document.write("<html>"); document.write("<head>"); document.write("<body bgcolor='aqua'>"); if ((chk1==true) && (chk2==false) && (chk3==false)) { document.write("<p style='font-family:arial black;color:blue;font-size:16px'> You have selected Campus A </p>"); document.write("<br/>"); document.write("<br/>"); } else if ((chk1==false) && (chk2==true) && (chk3==false)) { document.write("<p style='font-family:arial black;color:blue;font-size:16px'>You have selected Campus B </p>"); document.write("<br/>"); document.write("<br/>"); } else if ((chk1==false) && (chk2==false) && (chk3==true)) { document.write("<p style='font-family:arial black;color:blue;font-size:16px'>You have selected Campus C </p>"); document.write("<br/>"); document.write("<br/>"); } else if ((chk1==true) && (chk2==true) && (chk3==false)) { document.write("<p style='font-family:arial black;color:blue;font-size:16px'>You have selected Campus A and B </p>"); document.write("<br/>"); document.write("<br/>"); } else if ((chk1==true) && (chk2==false) && (chk3==true)) { document.write("<p style='font-family:arial black;color:blue;font-size:16px'>You have selected Campus A and C </p>"); document.write("<br/>"); document.write("<br/>"); } else if ((chk1==false) && (chk2==true) && (chk3==true)) { document.write("<p style='font-family:arial black;color:blue;font-size:16px>You have selected Campus B and C </p>"); document.write("<br/>"); document.write("<br/>"); } else if ((chk1==true) && (chk2==true) && (chk3==true)) { document.write("<p style='font-family:arial black;color:blue;font-size:16px'>You have selected Campus A,B and C </p>"); document.write("<br/>"); document.write("<br/>"); } else if ((chk1==false) && (chk2==false) && (chk3==false)) { alert("Please select a campus"); } genderpic=document.write("<img src='E:/modifying/tf.jpg'>"); document.write("<br/>"); document.write("<p style='font-family:arial black;color:blue;font-size:16px'>You are a: " + radgender + "</p>"); document.write("<br/>"); if ((fn=" ")||(mn=" ")||(ln=" ")) { alert("Please Enter your Full Name!"); return false; } else if ((fn!=" ")&&(mn!=" ")&&(ln!=" ")) { document.write("<p style='font-family:arial black;color:blue;font-size:16px'>Your full name is: " + fn + " " + mn + " " + ln + "</p>"); document.write("<br/>"); } document.write("<p style='font-family:arial black;color:blue;font-size:16px'>Your date of birth is: " + dd + "/" + mm + "/" + yy + "</p>"); document.write("<br/>"); if (radd=" ") { alert("Please enter Your Address!"); return false; } else if (radd!=" ") { document.write("<p style='font-family:arial black;color:blue;font-size:16px'>Your Residential Address is: " + radd + "</p>"); document.write("<br/>"); } document.write("<p style='font-family:arial black;color:blue;font-size:16px'>Your telephone number is: " + rp + "</p>"); document.write("<br/>"); document.write("<p style='font-family:arial black;color:blue;font-size:16px'>Your Mobile number is: " + mp + "</p>"); document.write("<br/>"); document.write("<p style='font-family:arial black;color:blue;font-size:16px'>Your department is: " + sel + "</p>"); document.write("<br/>"); if (course=" ") { alert("Please Enter the Name of your Course!"); return false; } else if (course!=" ") { document.write("<p style='font-family:arial black;color:blue;font-size:16px'>The name of your course is: " + course + "</p>"); document.write("<br/>"); } document.write("<a id='bktoform1' style='font-family:arial black;color:blue;font-size:16px' href='G:/modifying/registration_form_Trevlyn_Farrar_Yes.html' >Click here to go to the form (previous page) using hyperlink</a>"); document.write("<p id='bktoform2' style='font-family:arial black;color:blue;font-size:16px' onclick='window.history.back()'>Click here to go to the form (previous page) by just clicking this text</p>"); document.write("</body>"); document.write("</head>"); document.write("</html>"); } else { radgender = "Female"; document.write("<html>"); document.write("<head>"); document.write("<body bgcolor='pink'>"); if ((chk1==true) && (chk2==false) && (chk3==false)) { document.write("<p style='font-family:arial narrow;color:red;font-size:16px'> You have selected Campus A </p>"); document.write("<br/>"); document.write("<br/>"); } else if ((chk1==false) && (chk2==true) && (chk3==false)) { document.write("<p style='font-family:arial narrow;color:red;font-size:16px'>You have selected Campus B </p>"); document.write("<br/>"); document.write("<br/>"); } else if ((chk1==false) && (chk2==false) && (chk3==true)) { document.write("<p style='font-family:arial narrow;color:red;font-size:16px'>You have selected Campus C </p>"); document.write("<br/>"); document.write("<br/>"); } else if ((chk1==true) && (chk2==true) && (chk3==false)) { document.write("<p style='font-family:arial narrow;color:red;font-size:16px'>You have selected Campus A and B </p>"); document.write("<br/>"); document.write("<br/>"); } else if ((chk1==true) && (chk2==false) && (chk3==true)) { document.write("<p style='font-family:arial narrow;color:red;font-size:16px'>You have selected Campus A and C </p>"); document.write("<br/>"); document.write("<br/>"); } else if ((chk1==false) && (chk2==true) && (chk3==true)) { document.write("<p style='font-family:arial narrow;color:red;font-size:16px'>You have selected Campus B and C </p>"); document.write("<br/>"); document.write("<br/>"); } else if ((chk1==true) && (chk2==true) && (chk3==true)) { document.write("<p style='font-family:arial narrow;color:red;font-size:16px'>You have selected Campus A,B and C </p>"); document.write("<br/>"); document.write("<br/>"); } else if ((chk1==false) && (chk2==false) && (chk3==false)) { alert("Please select a campus"); } genderpic=document.write("<img src='E:/modifying/ms.jpg'>"); document.write("<br/>"); document.write("<p style='font-family:arial narrow;color:red;font-size:16px'>You are a: " + radgender + "</p>"); document.write("<br/>"); if ((fn=" ")||(mn=" ")||(ln=" ")) { alert("Please Enter your Full Name!"); return false; } else if ((fn!=" ")&&(mn!=" ")&&(ln!=" ")) { document.write("<p style='font-family:arial narrow;color:red;font-size:16px'>Your full name is: " + fn + " " + mn + " " + ln + "</p>"); document.write("<br/>"); } document.write("<p style='font-family:arial narrow;color:red;font-size:16px'>Your date of birth is: " + dd + "/" + mm + "/" + yy + "</p>"); document.write("<br/>"); if (radd=" ") { alert("Please enter Your Address!"); return false; } else if (radd!=" ") { document.write("<p style='font-family:arial narrow;color:red;font-size:16px'>Your Residential Address is: " + radd + "</p>"); document.write("<br/>"); } document.write("<p style='font-family:arial narrow;color:red;font-size:16px'>Your telephone number is: " + rp + "</p>"); document.write("<br/>"); document.write("<p style='font-family:arial narrow;color:red;font-size:16px'>Your Mobile number is: " + mp + "</p>"); document.write("<br/>"); document.write("<p style='font-family:arial narrow;color:red;font-size:16px'>Your department is: " + sel + "</p>"); document.write("<br/>"); if (course=" ") { alert("Please Enter the Name of your Course!"); return false; } else if (course!=" ") { document.write("<p style='font-family:arial narrow;color:red;font-size:16px'>The name of your course is: " + course + "</p>"); document.write("<br/>"); } document.write("<a id='bktoform1' style='font-family:arial narrow;color:red;font-size:16px' href='G:/modifying/registration_form_Trevlyn_Farrar_Yes.html' >Click here to go to the form (previous page) using hyperlink</a>"); document.write("<p id='bktoform2' style='font-family:arial narrow;color:red;font-size:16px' onclick='window.history.back()'>Click here to go to the form (previous page) by just clicking this text</p>"); document.write("</body>"); document.write("</head>"); document.write("</html>"); } } </script> </head> <body> <script language="javascript" type="text/javascript"> var dt=new Date(); document.write("<p align='right'>"); document.write(dt ); document.write("</p>"); </script> <h1>Registration Form</h1> <form Name="Registration" ID="FORM1" action="" method=""> <table> <tr> <p> <td> 1. Select your gender</td> <td> <input type="radio" id="radio1" name="Gender" value="Male" /> Male <br /> <input type="radio" id="radio2" name="Gender" value="Female" /> Female <br /> </td> </p> </tr> <tr> <p> <td>2. First Name:</td> <td><input type="text" id="text1" name="Fname" value="" size="30" /></td> </p> </tr> <tr> <p> <td>3. Middle Name:</td> <td><input type="text" id="text2" name="Mname" value="" size="30"/></td> </p> </tr> <tr> <p> <td>4. Last Name:</td> <td><input type="text" id="text3" name="Lname" value="" size="30"/></td> </p> </tr> <tr> <p> <td>5. Date of Birth (dd/mm/yyyy):</td> <td><input type="text" id="text4" name="dd" value="" size="2"/>/ <input type="text" id="text5" name="mm" value="" size="2"/>/ <input type="text" id="text6" name="yy" value="" size="4"/></td> </p> </tr> <tr> <p> <td>6. Residential Address (Not P.O. Box) </td> <td><textarea rows="4" cols="40" id="tarea1"> </textarea><br /></td> </p> </tr> <tr> <p> <td>7. Residential Phone Number:</td> <td><input type="text" id="text7" name="Rphone" value="" /></td> </p> </tr> <tr> <p> <td>8. Mobile Phone Number:</td> <td><input type="text" id="text8" name="Mphone" value="" /></td> </p> </tr> <tr> <p> <td>9. Choose your campus: </td> <td><input type="checkbox" id="check1" name="Campus" value="A" />Campus A<br /> <input type="checkbox" id="check2" name="Campus" value="B" />Campus B<br /> <input type="checkbox" id="check3" name="Campus" value="C" />Campus C<br /></td> </p> </tr> <tr> <p> <td>9. Choose your Department:</td> <td><select id="dept"> <option value="Nothing. Please Select a department"> Choose an Option... </option> <option value="Applied and Physical Science"> Applied and Physical Science</option> <option value="Arts"> Arts</option> <option value="Business and Commerce"> Business and Commerce</option> <option value="Education"> Education</option> <option value="Humanities"> Humanities</option> <option value="Information Technology and Computing"> Information Technology and Computing</option> <option value="Mathematics"> Mathematics</option> <option value="Pharmaceutical Science and Medical Science"> Pharmaceutical Science and Medical Science</option> <option value="Theoretical Science"> Theoretical Science</option> </select></td> </p> </tr> <tr> <p> <td>10. Name of Course Enrolled in:</td> <td><input type="text" id="text9" name="Course" value="" size="70"/></td> </p> </tr> </table> <p> <input type="button" name="button1" id="Submit" value="Submit" /> <input type="reset" name="button2" id="button2" value="Reset" /> <input type="button" name="button3" id="Display" value="Display" onclick="Mainfunc()" > </p> </table> <a href="http://getfreestat.com" style="font-size:9px;">free hit counter</a><br><a href="http://getfreestat.com"><img src="http://getfreestat.com/count.php?c_style=69&id=1301322705" border=0 alt="free hit counter"></a><br> <h6 align="bottom">This Form was designed by Trevlyn Christopher Farrar</h6> </body> </html> The following quiz template only supports 4 possible answers. Id like to add a 5th answer. Should be quite easy to do, but I dont know any programming. http://javascript.about.com/library/blquizf.htm On the template above each possible answer can be given a different score. Then at the and it adds up the score and displays a message according to your total score. Thanks in advance Heres the code: The following is contained in file quizhead.js: var quiz = new Array(); var r = 0; var analPage = 'results.html'; quiz[r++] =('38901~16~What score would you give to your supervisor?~Bad~Average~Good~Excellent~1~4'); The following goes to on the page where the questions appear on the head section: <script src="quizhead.js" type="text/javascript"> </script> The following is contained in quizbody.js file: // Analysis Quiz Javascript // copyright 20th December 2004 - 13th May 2005, by Stephen Chapman // permission to use this Javascript on your web page is granted // provided that all of the code in this script (including these // comments) is used without any alteration function displayResult(cor) { document.write('<div style="font-size:14px;"><b>You have completed the quiz.<\/b><\/div><blockquote><span style="font-size:12px;">*<br \/>*<br \/>*<br \/>*<br \/><\/span><\/blockquote><div><a href="'+analPage+'?cor='+cor+'">Your result</a><\/div>'); } var qsParm = new Array(); function qs() { var query = window.location.search.substring(1); var parms = query.split('&'); for (var i=0; i<parms.length; i++) { var pos = parms[i].indexOf('='); if (pos > 0) { var key = parms[i].substring(0,pos); var val = parms[i].substring(pos+1); qsParm[key] = val; } } } qsParm['questnum'] = 0; qsParm['cor'] = 0; qs(); var questnum = qsParm['questnum']; var cor = qsParm['cor'];cor=cor%475; function checkAnswer(e,b,g){ var a = -1; var x = Math.floor(g/b); // x = bdca for (var i=0; i<e.c.length; i++) {if (e.c[i].checked) {a = i;}} if (a == -1) { alert("You must select an answer"); return false; } var b = new Array(); b[1] = Math.floor(x/1000); x -= b[1]*1000; b[3] = Math.floor(x/100); x -= b[3]*100; b[2] = Math.floor(x/10); b[0] = x - b[2]*10; cor += b[a]; var www = self.location.href.lastIndexOf('?'); var thispage = self.location.href; if (www != -1) thispage = self.location.href.substr(0,www); questnum++; var p = Math.floor((Math.random() * 8) + 2); var m = (p * 475) +cor; top.location = thispage + '?questnum='+ questnum +'&cor='+m; return false; } function result(cor) { var lo = 0, hi = 0; for (var i=0;i < quiz.length;i++) { var f = quiz[i].split('~'); lo += parseInt(f[7]); hi += parseInt(f[8]); } return Math.round((cor - lo) * 100 / (hi - lo)); } var tblsz = quiz.length; document.write('<table align="center" cellpadding="3" width="350" border="1"><tr>'); if (questnum < quiz.length) { var f = quiz[questnum].split('~'); document.write('<td align="left"><form name="myForm"><div style="font-size:14px;">Question: '+f[2]+'</div><blockquote><span style="font-size:12px;">\n'); document.write('<input type="radio" name="c" value="0" /> '+f[3]+'<br />\n'); document.write('<input type="radio" name="c" value="1" /> '+f[4]+'<br />\n'); if (f[5] != '') document.write('<input type="radio" name="c" value="2" /> '+f[5]+'<br />\n'); if (f[6] != '') document.write('<input type="radio" name="c" value="3" /> '+f[6]+'<\/span><\/blockquote>\n'); document.write('<div align="right"><input type="button" value="Next Question" onclick="checkAnswer(myForm,'+f[1]+','+f[0]+');return false;" /><\/div><\/form>\n'); } else { document.write('<td align="center">\n'); document.write('<form name="myForm">'); displayResult(result(cor)); document.write('<\/form>\n');} document.write('<\/td><\/tr><\/table>\n'); The following goes on the page where the questions appear on the body section: <script src="quizbody.js" type="text/javascript"> </script><noscript><table align="center" cellpadding="3" width="350" border="1"><tr> <td align="left"><div><b>This Quiz requires Javascript</b> </div><blockquote>You either have Javascript disabled <br />or the browser you are using does not<br /> support Javascript. Please use a Javascript<br /> enabled browser to access this quiz.<br /> <br /> </blockquote></td></tr></table></noscript> The following is contained in the quizresh.js file: // Analysis Quiz Javascript // copyright 20th December 2004, by Stephen Chapman // permission to use this Javascript on your web page is granted // provided that all of the code in this script (including these // comments) is used without any alteration var qsParm = new Array(); function qs() { var query = window.location.search.substring(1); var parms = query.split('&'); for (var i=0; i<parms.length; i++) { var pos = parms[i].indexOf('='); if (pos > 0) { var key = parms[i].substring(0,pos); var val = parms[i].substring(pos+1); qsParm[key] = val; } } } qsParm['cor'] = 0; qs(); var cor = qsParm['cor']; This goes on the page where the results are displayed on the head section: <script src="quizresh.js" type="text/javascript"> </script> The following is contained in the quizresb.js file: // Analysis Quiz Results if (cor <= 25) document.write('<p>Good<\/p>'); else if (cor <= 50) document.write('<p>Very Good<\/p>'); else if (cor <= 75) document.write('<p>Excellent<\/p>'); else document.write('<p>Perfect<\/p>'); This goes on the results page on the body section: <script src="quizresb.js" type="text/javascript"> </script> Hi! I need to make my own web page with quiz on it! Something like this http://www.javascriptkit.com/script/popquiz.htm The main problem - how to calculate scores? I need to make, for example, pop up box that shows, how many answers are right/wrong. What should I use for that? I'm still new to javascript.. My question: How and where do I add an alert that comes up to make sure the user answers all questions before the pop-up window comes up to display score and answers? Here is a link to the quiz Thanks sooo much!! Below is the code.. Code: <script language="javascript" type="text/javascript"> var done = new Array; var yourAns = new Array; var score = 0; function getRBtnName(GrpName) { var sel = document.getElementsByName(GrpName); var fnd = -1; var str = ''; for (var i=0; i<sel.length; i++) { if (sel[i].checked == true) { str = sel[i].value; fnd = i; } } // return fnd; // return option index of selection // comment out next line if option index used in line above return str; } function StatusAllCheckboxes(IDS,cnt) { var str = ''; IDS = 'q'+IDS; var tmp = ''; for (var i=0; i<cnt; i++) { tmp = document.getElementById(IDS+'_'+i); if (tmp.checked) { str += tmp.value + '|'; } } return str; } // function Engine(question, answer, opt, Qtype) { function Engine(question, answer, Qtype) { switch (Qtype) { case "RB" : yourAns[question] = answer; break; case "SB" : yourAns[question] = answer; break; default : yourAns[question] = ''; alert('Invalid question type: '+Qtype); break; } } function EngineCB(question, answer, itemcnt) { // answer is not used at this time yourAns[question] = StatusAllCheckboxes(question,itemcnt); // alert('question: '+question+' :'+yourAns[question]); } //This is the code that calculates the score. function Score(){ score = 0; var tmp = ''; var answerText = "Quiz Results<p>"; // alert('Size of QR: '+QR.length); for (var i=1; i<QR.length; i++) { answerText = answerText+"<br>Question :"+i+" Your answer: "+yourAns[i]+"<br>"; tmp = QR[i][3]; if (QR[i][0] == 'CB') { tmp = tmp+'|'; } // alert(i+' : '+tmp+' : '+yourAns[i]+'\n\n'+answerText+'\n\n'); if (tmp != yourAns[i]) { answerText = answerText+"<br>The correct answer was "+QR[i][3]+"<br>"+explainAnswer[i]+"<br>"; } else { answerText = answerText+" <br>You got this one right! <br>"; score++; } } answerText=answerText+"<br><br>Your total score is : "+score+" out of "+(QR.length-1)+"<br>"; // for varying number of questions, alter scoring var ScoreMax = QR.length-1; var ScoreInc = Math.floor(ScoreMax / 12); // Don't have fewer than 5 questions. answerText=answerText+"<br>Comment : "; if(score<=ScoreInc){ answerText=answerText+"Not quite."; } if(score>=(ScoreInc+1) && score <=(ScoreInc*2)){ answerText=answerText+"Try Again!."; } if(score>=(ScoreInc*2+1) && score <=(ScoreInc*3)){ answerText=answerText+"Rats!."; } if(score>=(ScoreInc*3+1) && score <=(ScoreInc*4)){ answerText=answerText+"Maybe better next time"; } if(score>=(ScoreInc*4+1) && score <=(ScoreInc*5)){ answerText=answerText+"Try Again!"; } if(score>=(ScoreInc*5+1) && score <=(ScoreInc*6)){ answerText=answerText+"I bet you can do better!"; } if(score>=(ScoreInc*6+1) && score <=(ScoreInc*7)){ answerText=answerText+"Hey, pretty good job!"; } if(score>=(ScoreInc*7+1) && score <=(ScoreInc*8)){ answerText=answerText+"You almost got it!"; } if(score>=(ScoreInc*8+1) && score <=(ScoreInc*9)){ answerText=answerText+"Pretty Good! "; } if(score>=(ScoreInc*9+1) && score <=(ScoreInc*10)){ answerText=answerText+"Almost! You can do it!"; } if(score>(ScoreInc*11+1)){ answerText=answerText+"You did GREAT! Congratulations."; } var w = window.open('', '', 'height=500,width=750,scrollbars'); w.document.open(); w.document.write(answerText); w.document.close(); } </script> Code: <form name="myform" class="quiz"> <ol> <script type="text/javascript"> var str = ''; var tmpr = []; var resp = ['True','False']; // allows for up to 10 responses (can have more) for (q=1; q<QR.length; q++) { str += '<li class="quiz">'+QR[q][1]+'</li><br />'; tmpr = QR[q][2].split('|'); switch (QR[q][0]) { case 'RB' : for (var r=0; r<tmpr.length; r++) { str += '<input type="radio" name="q'+q+'" value="'+resp[r]+'"'; str += ' onClick="Engine('+q+',this.value,\''+QR[q][0]+'\')">'; str += ' '+tmpr[r]+'<br />'; } break; case 'CB' : for (var r=0; r<tmpr.length; r++) { str += '<input type="checkbox" id="q'+q+'_'+r+'" name="q'+q+'" value="'+resp[r]+'"'; str += ' onClick="EngineCB('+q+',this.value,'+tmpr.length+')">'; str += resp[r]+' '+tmpr[r]+'<br />'; } break; case 'SB' : str += '<select name="q'+q+'" size="1" id="q'+q+'"'; str += ' onClick="Engine('+q+',this.value,\''+QR[q][0]+'\')">'; for (var r=0; r<tmpr.length; r++) { str += '<option value="'+resp[r]+'">'; str += tmpr[r]+'</option>'; } str += '</select>'; break; /* test code for future entries -- not implemented yet case 'CBM' : break; case 'SBM' : str += '<select name="q'+q+'" size="1" id="q'+q+'"'; str += ' onClick="Engine('+q+',this.value,\''+QR[q][0]+'\')" multiple>'; for (var r=0; r<tmpr.length; r++) { str += '<option name="q'+q+'" value="'+resp[r]+'">'; str += tmpr[r]+'</option>'; } str += '</select>'; break; */ default : str += q+': Invalid type: '+QR[q][0]; break; } str += "<p />"; } document.write(str); </script> <br /> <br /> <input type=button onClick="Score()" value="How did I do?"> </ol> </form> ...only allow for users to enter in characters from A-Z? I have several small questions: 1) I have a validation function that allows for the user to navigate to the next webpage if they enter in all of the details correctly, then they can go to the Checkout. However, when I try it, what happens is that if the alert message about entering an invalid date appears and the user clicks on OK, then the confirmation message that is used to help the user navigate to the Checkout, when I do not want them to be able to override the validation. My coding is: Code: function ValidatePaymentDetails() { var cardnum=document.forms["payment"]["cardnumber"].value; var cardexp=document.forms["payment"]["cardexpirydate"].value; var cardsec=document.forms["payment"]["cardsecuritynumber"].value; var href="checkout.html"; if (((hasWhiteSpace2(cardnum))&&(hasWhiteSpace2(cardexp))&&(hasWhiteSpace2(cardsec)))) { alert("You have not entered any suitable values for the Card Number, Card Expiry Date or Card Security Number fields. Enter in suitable values, possibly by removing any leading or trailing spaces"); } else if (((cardnum==null||cardnum=="")&&(cardexp==null||cardexp=="") && (cardsec==null||cardsec==""))) { alert("You have not entered any suitable values for the Card Number, Card Expiry Date or Card Security Number fields. Enter in suitable values."); } else if ((hasWhiteSpace2(cardnum))&&(hasWhiteSpace2(cardexp))) { alert("You have not entered any suitable values for the Card Number or Card Expiry Date fields. Enter in suitable values, possibly by removing any leading or trailing spaces"); } else if ((cardnum==null||cardnum=="")&&(cardexp==null||cardexp=="")) { alert("You have not entered any suitable values for the Card Number or the Card Expiry fields. Enter in suitable values."); } else if ((hasWhiteSpace2(cardnum))&&(hasWhiteSpace2(cardsec))) { alert("You have not entered any suitable values for the Card Number or Card Security Number fields. Enter in suitable values, possibly by removing any leading or trailing spaces"); } else if((cardnum==null||cardnum=="")&&(cardsec==null||cardsec=="")) { alert("You have not entered any suitable values for the Card Number or the Card Security Number fields. Enter in suitable values."); } else if ((hasWhiteSpace2(cardexp))&&(hasWhiteSpace2(cardsec))) { alert("You have not entered any suitable values for the Card Expiry Date or Card Security Number fields. Enter in suitable values, possibly by removing any leading or trailing spaces"); } else if((cardexp==null||cardexp=="")&&(cardsec==null||cardsec=="")) { alert("You have not entered any suitable values for the Card Expiry Date or the Card Security Number fields. Enter in suitable values."); } else if (hasWhiteSpace2(cardnum)) { alert("You have not entered in a suitable value for the Card Number field. Enter in a suitable value, possibly by removing any leading or trailing spaces"); } else if(cardnum==null|| cardnum=="") { alert("You have not entered a suitable value for the Card Number field. Enter in a suitable value."); } else if (hasWhiteSpace2(cardexp)) { alert("You have not entered in a suitable value for the Card Expiry Date field. Enter in a suitable value, possibly by removing any leading or trailing spaces"); } else if(cardexp==null|| cardexp=="") { alert("You have not entered a suitable value for the Card Expiry Date field. Enter in a suitable value."); } else if (hasWhiteSpace2(cardsec)) { alert("You have not entered a suitable value for the Card Security Number field. Enter in a suitable value, possibly by removing any leading or trailing spaces"); } else if(cardsec==null|| cardsec=="") { alert("You have not entered a suitable value for the Card Security Number field. Enter in a suitable value."); } else if (checknumber(cardnum)==false) { alert("You have not entered in a valid Card Number in the Card Number field. Make sure that it is in the 0000-0000-0000-0000 format and remove any leading or trailing spaces. Enter in a suitable value."); } else if (checksecnumber(cardsec)==false) { alert("You have not entered in a valid Card Security Number in the Card Security Number field. Make sure it is in the 000 format. Enter in a suitable value."); } else if (compareDate(cardexp)==true) { return true; } else { return contCheckout(); } } and the code for contCheckout() is: Code: function contCheckout() { var nav=confirm("Are you sure you want to continue your order and go to the Checkout? Click OK to continue or click on Cancel to make changes to your payment details until you are ready to continue"); if (nav===true) { location.href="checkout.html"; } else { location.href="#"; } } 2). This question is I would like a function so that only characters between A-Z can be inputted and possibly have a capital letter as only the first character. I'm sure that a regexp function will be needed, but I'm not entirely sure how to implement it 3) Final quick question, for some reason some of my alert boxes appear twice (i.e. the user clicks on OK, and then the alert box opens up again). Is there any quick fix for this? Any help is appreciated! Thanks So I am working on a fairly difficult project (for my level at least). I actually had this project planned before I even knew JavaScript so I specifically learned JavaScript in order to write this program! Here is my plan: I am writing a javascript program to help students prepare to take an exam (a standardized test). The test consists of 80 questions from various topics in history. The test covers three time spans (0-1000, 1000-1500, 1500-2000) and 4 different question types (ie. politics, culture, economics, foreign relations). Likewise, each question will cover a specific topic, maybe one will be about a specific war and another question will be about a leader. What I want the quiz to do is give a detailed report on the student's strengths and weaknesses. Once the student is done with the quiz and they select "grade" it will take them to the results page which will show them: 1. their score (percent correct) 2. percent correct for each of the time periods. 3. percent correct for each of the question types 4. a recommended chapter reading list based on the questions they got wrong. I did some search on the internet and found a basic script that ive been using. All it does is have the html code for the questions and the, "grade" button only shows the percent correct and which which questions were wrong. Its basically a simple quiz script without any of the advanced features I want. I figure I'll just add the advanced features to this existing script. Here is a link to the example script I am using. So far my script is 100% the same (except different questions and answers). What is the best route to modify that script to add all the features I want. From what I've read on javascript so far. I have to write a function to process each of the elements I want to display on the results page. I have no idea about how to do that though. My code goes through the answer function (below) and it determins if you answered green. If you answered green a popup says correct other wise incorrect. How can I modify my code so that I can add multiple answers for different questions.Example q1 answer = green q2 answer = blue . . q20 answer = Friday Here is my .js code Code: var n = 16; // modify this for number of seconds to answer document.getElementById( 'time').value = "Answer in " + n + " seconds"; var i = setInterval('count()' , 1000); var tooLate; function count() { tooLate = 0; n--; if(n >=0) { document.getElementById( 'time').value = "Answer in " + n + " seconds"; } else { clearInterval(i); alert("Too late!"); if(document.getElementById( 'answer').value == correct){ tooLate = 1; } } function answer() { var correct = "green"; // This is the correct answer if (tooLate == 0) { if(document.getElementById( 'answer').value == correct) { clearInterval(i); alert("Right Answer with " + n + " seconds remaining"); } else{ clearInterval(i); alert("Incorrect! The answer was " + correct); } } submitform(); //submit form function submitform() { document.forms["myform"].submit(); } } I need to comment on my code. I did what i can but i have been told that it is still not enough. can anybody help me with this one ? < Code: <HTML> <HEAD> <TITLE>SIMPLE QUIZ ON ANIMAL ZOO</TITLE> <STYLE TYPE="text/css"> <!-- CSS code for my header --> BODY {text-align:center} </style> <script language="JavaScript"> // An Array is a special type of variable var x; // The letter x is used to hold a value and also expressions x = 0; //This states that variable x has value of 0. var Pictures = new Array(4); //It declares a variable to an array var Questions = new Array(4);//It declares a variable to an array var answers1 = new Array (); // It declares a varibale to an array var answers2 = new Array (); // It declares a varibale to an array var answers3 = new Array (); // It declares a varibale to an array var answers4 = new Array (); // It declares a varibale to an array var correctanswers = new Array(4); var score = 0; // It keeps the pathway of the score var userans = new Array (4);//The variable is declaring new array var incorr = 0; var isChecked = false; //The variable is defined as boolean by giving an initial value of false Pictures[0] = "Pic/1.jpg"; // These are the pictures for the quiz Pictures[1] = "Pic/2.jpg"; Pictures[2] = "Pic/3.jpg"; Pictures[3] = "Pic/4.jpg"; Pictures[4] = "Pic/5.jpg"; Questions[0] = "Which is the biggest shark?"; // These are the questions Questions[1] = "How much can tiger weighs?"; Questions[2] = "What colour are skunks?"; Questions[3] = "Why do red-eyed tree frogs have big red eyes? "; Questions[4] = "Which family of animals does the chimp belong to?"; answers1[0] = "Tiger shark"; // These are the answers for text box1 answers1[1] = "200 kilos"; answers1[2] = "Red and white"; answers1[3] = "To look like plants"; answers1[4] = "Apes"; answers2[0] = "Great white Shark"; // These are the answers for text box2 answers2[1] = "300 kilos"; answers2[2] = "Blue and Yellow"; answers2[3] = "To have better view at their food"; answers2[4] = "Monkey"; answers3[0] = "Grey reef shark"; // These are the answers for text box3 answers3[1] = "360 kilos"; answers3[2] = "Black and white"; answers3[3] = "To look far"; answers3[4] = "Gorilla"; answers4[0] = "Hammerhead shark"; // These are the answers for text box4 answers4[1] = "420 kilos"; answers4[2] = "Green"; answers4[3] = "To scare the predators"; answers4[4] = "Chimpanzee"; correctanswers[1] = 2; // These are the correct answers for the questions. correctanswers[2] = 3; correctanswers[3] = 3; correctanswers[4] = 4; correctanswers[5] = 1; function Next(){ //It calls the function "Next" for (i=0; i<document.Form.answer.length; i++) { if (document.Form.answer[i].checked==true) isChecked = true; } if (isChecked==false) alert ("Please Select an Answer"); else { for (var i=0; i<document.Form.answer.length; i++) { if (document.Form.answer[i].checked==true){ userans[x]= i + 1; //document.Form.answer[i].checked = false; } } if (userans[x]==correctanswers[x]) alert ("This is the correct answer"); else alert ("This is not the correct answer"); //alert (document.Form.answer[i].value); //alert (userans[x]); Picture(); } } /* The code below calls the function Picture. The code below does the following: Adds score if the answer is right */ function Picture() { if (x==5){ for (var k=0; k<5; k++) { if (userans[k]==correctanswers[k]) { score = score + 1 } else { incorr = incorr + 1 } } alert("The score is " + score + " \n \n Correct Answers a \n \n 1. Great white shark \n 2. 360 Kilos \n 3. Black and white \n 4. To scare the predators \n 5. Apes" ); } else{ //The code will display the pictures, questions and answers in the browser document.Pic.src=Pictures[x]; Form.questions.value = Questions[x]; // It shows the questions inside the form in text Form.text1.value=answers1[x]; // It shows the answers1 inside the form in text1 Form.text2.value=answers2[x]; // It shows the answers2 inside the form in text2 Form.text3.value=answers3[x]; // It shows the answers3 inside the form in text3 Form.text4.value=answers4[x]; // It shows the answers4 inside the form in text4 x = x + 1; } isChecked = false for (i=0; i<document.Form.answer.length; i++) { document.Form.answer[i].checked=false; } } function Restart() //This code is used for "Restart" button which will restart the quiz to the beginning. { location.reload(true); } // When the page loads this code will dispaly the first Questions and Pictures and it will carry on. </script> </HEAD> <BODY> <BODY BODY BGCOLOR="Maroon"> <FONT FACE="ARIAL" Size="+3" COLOR="GOLD"> <CENTER><B><U> SIMPLE QUIZ ON ANIMAL ZOO </U></B></CENTER> <br> </FONT> <BLOCKQUOTE> <FONT FACE="ARIAL" Size="+1" COLOR="BEIGE"> <body onload="Picture()"> <form name="Form"><br> <img name="Pic" src="Pic/1.jpg" width="130" height="140" /> <br> <br> <input type="text" size="90" height="250" name="questions" /><br /><br /> <input type="radio" name="answer" value="1" /><input name = "text1" size="45 height ="250"/><br /> <br /> <input type="radio" name="answer" value="2" /><input name = "text2" size="45 height ="250"/><br /><br> <input type="radio" name="answer" value="3" /><input name = "text3" size="45 height ="250"/> <br> <br /> <input type="radio" name="answer" value="4" /><input name = "text4" size="45 height ="250"/> <br><br> <input name="return" Type=Button Value=" Restart " onclick="Restart()"> <input name="Submit" Type=Button Value=" Next " onClick="Next()"> </form> </body> </html> Hi, I want to make a simple quiz in HTML using JavaScript. I have made a web page called scoreboard which contains two tables. I have attached the screen shot of how the web page looks as well as the coding here with this msg. below is the description of my web page. If you find it lengthy or not understandable, pls refer my attached image of the web page. Description one table contains two rows - one for direct answers and another for answers which are given during their pass chance in the quiz. There are four buttons - Team A, Team B, Team C and Team D for both the direct and pass. And the second table contains four text boxes which which displays the score for each Team. Now, in my web page i have typed the required coding so that when in click the TeamA, TeamB,...buttons in the direct row, the score board for Team A adds up 10 points. Now i want to add 5 points for the respective teams when i click their team button in the pass row. I am not able to code that. I am new to JS. so pls help me. the code goes below. thanks in advance. Code: <html> <head> <title>score card</title> <form name="myform"> <script language="javascript"> function score_computeA(n) { var score = parseInt(document.myform.t1.value,10); n = parseInt(n,10); score= score + n; document.myform.t1.value = score; } function score_computeB(n) { var score = parseInt(document.myform.t2.value,10); n = parseInt(n,10); score= score + n; document.myform.t2.value = score; } function score_computeC(n) { var score = parseInt(document.myform.t3.value,10); n = parseInt(n,10); score= score + n; document.myform.t3.value = score; } function score_computeD(n) { var score = parseInt(document.myform.t4.value,10); n = parseInt(n,10); score= score + n; document.myform.t4.value = score; } </script> </head> <body> <p align="center"><font face="Broadway" size="6">School name goes here</font></p> <p align="center"><font face="Baskerville Old Face" color="#FF0000" size="5"> Quiz</font></p> <p align="center"> </p> <p align="center"><font face="Arial Rounded MT Bold" size="5" color="#008000"> Administrative Panel</font></p> <div align="center"> <table border="1" width="69%" height="83"> <tr> <td width="98" height="35"> <p align="left">Direct</td> <td height="35"> <p align="center"><input type="button" value="Team A" name="d1" onclick = "score_computeA(10)"></td> <td height="35"> <p align="center"><input type="button" value="Team B" name="d2" onclick = "score_computeB(10)"></td> <td height="35"> <p align="center"><input type="button" value="Team C" name="d3" onclick = "score_computeC(10)"></td> <td height="35"> <p align="center"><input type="button" value="Team D" name="d4" onclick = "score_computeD(10)"></td> </tr> <tr> <td width="98">Pass</td> <td> <p align="center"><input type="button" value="Team A" name="p1" onclick ="pass_computeA(5)"></td> <td> <p align="center"><input type="button" value="Team B" name="p2"></td> <td> <p align="center"><input type="button" value="Team C" name="p3"></td> <td> <p align="center"><input type="button" value="Team D" name="p4"></td> </tr> </table> <hr> <p align="center"> <font face="Arial Rounded MT Bold" size="5" color="#008000">Score Card</font></p> <table border="1" width="59%" height="82"> <tr> <td width="155">Team</td> <td width="177">Team A</td> <td width="166">Team B</td> <td width="160">Team C</td> <td>Team D</td> </tr> <tr> <td width="155">Score</td> <td width="177"> <p align="center"> <input name="t1" size="22" value="0" style="border:3px double #FF0000; float: right"></td> <td width="166"> <input type="text" name="t2" size="22" value="0" style="border: 3px double #FF0000"></td> <td width="160"> <input type="text" name="t3" size="22" value="0" style="border: 3px double #FF0000"></td> <td> <input type="text" name="t4" size="22" value="0" style="border: 3px double #FF0000"></td> </tr> </table> </div> </form> <p align="center"> </p> </body> </html> Hi, I was tasked with creating a JavaScript quiz... I succeeded in doing so but part of the requirement was to use hidden fields for the answers. Would this be possible using the code I currently have: Thanks Code: <html> <head> <script type="text/javascript"> function valid() { cor = "0" incor = "0" test0 = document.myform.elements[0].value; test1 = document.myform.elements[1].value; test2 = document.myform.elements[2].value; test3 = document.myform.elements[3].value; test4 = document.myform.elements[4].value; test5 = document.myform.elements[5].value; test6 = document.myform.elements[6].value; test7 = document.myform.elements[7].value; test8 = document.myform.elements[8].value; test9 = document.myform.elements[9].value; if (test0 == "64") { alert("Congratulations you got question one correct!"); ++cor } else alert("Sorry, you got question one incorrect!"); if (test1 == "56") { alert("Congratulations you got question two correct!"); ++cor } else alert("Sorry, you got question two incorrect!"); if (test2 == "7") { alert("Congratulations you got question three correct!"); ++cor } else alert("Sorry, you got question three incorrect!"); if (test3 == "8") { alert("Congratulations you got question four correct!"); ++cor } else alert("Sorry, you got question four incorrect!"); if (test4 == "100") { alert("Congratulations you got question five correct!"); ++cor } else alert("Sorry, you got question five incorrect!"); if (test5 == "1947") { alert("Congratulations you got question six correct!"); ++cor } else alert("Sorry, you got question six incorrect!"); if (test6 == "1") { alert("Congratulations you got question seven correct!"); ++cor } else alert("Sorry, you got question seven incorrect!"); if (test7 == "7") { alert("Congratulations you got question eight correct!"); ++cor } else alert("Sorry, you got question eight incorrect!"); if (test8 == "132") { alert("Congratulations you got question nine correct!"); ++cor } else alert("Sorry, you got question nine incorrect!"); if (test9 == "5280") { alert("Congratulations you got question ten correct!"); ++cor } else alert("Sorry, you got question ten incorrect!"); //else ++incor alert("you got " + cor + " right\n You got " + cor/10 * 100 + "% correct!"); } </script> </head> <body> <form name="myform"> <table border="1" cellpadding="10"> <tr><td>1. 64 added to what number gives a sum of 128?</td><td><input type="text" name="q1"></td></tr> <tr><td>2. The product of 8 and 7 is?</td><td><input type="text" name="q2"></td></tr> <tr><td>3. 35 divided by 5 is:</td><td><input type="text" name="q3"></td></tr> <tr><td>4. 40 divided by 5 is:</td><td><input type="text" name="q4"></td></tr> <tr><td>5. What is the area of rectangle that measure 5 by 20?</td><td><input type="text" name="q5"></td></tr> <tr><td>6. What is 3054 subtracted from 5001?</td><td><input type="text" name="q6"></td></tr> <tr><td>7. What is the result of 5 x 8-39?</td><td><input type="text" name="q7"></td></tr> <tr><td>8. What is the binary number 111 in decimal?</td><td><input type="text" name="q8"></td></tr> <tr><td>9. The sum of 33 and 44 and 55 is:</td><td><input type="text" name="q9"></td></tr> <tr><td>10. How many feet in a mile?</td><td><input type="text" name="q10"></td></tr> <tr><td><input type="button" onClick="valid()" value="score"></td><td><input type="reset"></td></tr> </form> </table> </body> </html> JavaScript code responsive quiz I live in turkey. Can you write me such a code for my site? Inside of here if you save as a .html and open it it will pull up the game a series of 5 boxes and 5 answers underneath, Currently those 5 answers correctly correlate with each box so you know what they are considering you don't have the .jpgs to display them. The one in bold is the "question" when you click on the one that correlates with the bold it should tell you Correct! 100. 100 being your score and if you get it wrong it will say sorry! and then take your score down to a 50 since you got 1 out of 2 wrong. The problem is when you get it wrong it also immediatly says Congrats! after you get it wrong So it will prompt a Sorry! alert and a Congrats! alert on the wrong answer. The second problem is after the user gets it right or wrong, I need it to re random the list of answers and images. Whilst keeping the score intact for up to 20 questions. Please help! Code: <body> <script type="text/javascript"> var counter = 0; var correct = 0; function show_alert0() { {counter++;} if (randomname0 != final) {alert("Sorry." + (( correct / counter ) * 100 ));} else {correct++;} {alert("Congrats!" + (( correct / counter ) * 100 ));} } function show_alert1() { {counter++;} if (randomname1 != final) {alert("Sorry." + (( correct / counter ) * 100 ));} else {correct++;} {alert("Congrats!" + (( correct / counter ) * 100 ));} } function show_alert2() { {counter++;} if (randomname2 != final) {alert("Sorry." + (( correct / counter ) * 100 ));} else {correct++;} {alert("Congrats!" + (( correct / counter ) * 100 ));} } function show_alert3() { {counter++;} if (randomname3 != final) {alert("Sorry." + (( correct / counter ) * 100 ));} else {correct++;} {alert("Congrats!" + (( correct / counter ) * 100 ));} } function show_alert4() { {counter++;} if (randomname4 != final) {alert("Sorry." + (( correct / counter ) * 100 ));} else {correct++;} {alert("Congrats!" + (( correct / counter ) * 100 ));} } </script> <script type="text/javascript"> var randomnumber0=Math.floor(Math.random()*66) var randomnumber1=Math.floor(Math.random()*66) var randomnumber2=Math.floor(Math.random()*66) var randomnumber3=Math.floor(Math.random()*66) var randomnumber4=Math.floor(Math.random()*66) while (randomnumber0==randomnumber1 || randomnumber0==randomnumber2 || randomnumber0==randomnumber3 || randomnumber0==randomnumber4) {randomnumber0=Math.floor(Math.random()*66)} while (randomnumber1==randomnumber0 || randomnumber1==randomnumber2 || randomnumber1==randomnumber3 || randomnumber1==randomnumber4) {randomnumber1=Math.floor(Math.random()*66)} while (randomnumber2==randomnumber0 || randomnumber2==randomnumber1 || randomnumber2==randomnumber3 || randomnumber2==randomnumber4) {randomnumber2=Math.floor(Math.random()*66)} while (randomnumber3==randomnumber0 || randomnumber3==randomnumber1 || randomnumber3==randomnumber2 || randomnumber3==randomnumber4) {randomnumber3=Math.floor(Math.random()*66)} while (randomnumber4==randomnumber0 || randomnumber4==randomnumber1 || randomnumber4==randomnumber2 || randomnumber4==randomnumber3) {randomnumber4=Math.floor(Math.random()*66)} document.write('<p style="text-align:center">') document.write('<em>Click on the ribbon that matches the name below.</em><br/><br/>') document.write('<button type="button" height="300" width="300" onclick="show_alert0()"><img src="https://www.intelink.gov/sites/afpaa/Shared%20Documents/rank'+randomnumber0+'.jpg" height="300px" width="200px"></button>') document.write('<button type="button" height="300" width="300" onclick="show_alert1()"><img src="https://www.intelink.gov/sites/afpaa/Shared%20Documents/rank'+randomnumber1+'.jpg" height="300px" width="200px"></button>') document.write('<button type="button" height="300" width="300" onclick="show_alert2()"><img src="https://www.intelink.gov/sites/afpaa/Shared%20Documents/rank'+randomnumber2+'.jpg" height="300px" width="200px"></button>') document.write('<button type="button" height="300" width="300" onclick="show_alert3()"><img src="https://www.intelink.gov/sites/afpaa/Shared%20Documents/rank'+randomnumber3+'.jpg" height="300px" width="200px"></button>') document.write('<button type="button" height="300" width="300" onclick="show_alert4()"><img src="https://www.intelink.gov/sites/afpaa/Shared%20Documents/rank'+randomnumber4+'.jpg" height="300px" width="200px"></button><br/>') document.write('</style>') var name = new Array(); name[0] = "Airman"; name[1] = "Airman 1st Class"; name[2] = "Senior Airman"; name[3] = "Staff Sergeant"; name[4] = "Technical Sergeant "; name[5] = "Master Sergeant"; name[6] = "First Master Sergeant"; name[7] = "Senior Master Sergeant"; name[8] = "First Senior Master Sergeant"; name[9] = "Chief Master Sergeant"; name[10] = "First Chief Master Sergeant"; name[11] = "Command Chief Master Sergeant"; name[12] = "Chief Master Sergeant of the Air Force"; name[13] = "2nd Lieutenant"; name[14] = "1st Lieutenant"; name[15] = "Captain"; name[16] = "Major"; name[17] = "Lieutenant Colonel"; name[18] = "Colonel"; name[19] = "Brigadier General"; name[20] = "Major General"; name[21] = "Lieutenant General"; name[22] = "General"; name[23] = "General of the ..."; name[24] = "Private"; name[25] = "Private 1st Class"; name[26] = "Specialist"; name[27] = "Corporal"; name[28] = "Sergeant"; name[29] = "Staff Sergeant"; name[30] = "Sergeant First Class"; name[31] = "Master Sergeant"; name[32] = "First Sergeant"; name[33] = "Sergeant Major"; name[34] = "Command Sergeant Major"; name[35] = "Sergeant Major of the Army"; name[36] = "Warrant Officer (W01)"; name[37] = "Chief Warrant Officer (CW2) "; name[38] = "Chief Warrant Officer (CW3)"; name[39] = "Chief Warrant Officer (CW4)"; name[40] = "Chief Warrant Officer (CW5)"; name[41] = "Private First Class"; name[42] = "Lance Corporal"; name[43] = "Corporal"; name[44] = "Sergeant"; name[45] = "Staff Sergeant"; name[46] = "First Sergeant"; name[47] = "Sergeant Major"; name[48] = "Master Gunnery Sergeant"; name[49] = "Warrant Officer (W0)"; name[50] = "Chief Warrant Officer (CW02)"; name[51] = "Chief Warrant Officer (CW03)"; name[52] = "Chief Warrant Officer (CW04)"; name[53] = "Chief Warrant Officer (CW05)"; name[54] = "Seaman Apprentice"; name[55] = "Seaman"; name[56] = "Petty Officer Third Class"; name[57] = "Petty Officer Second Class"; name[58] = "Petty Officer First Class"; name[59] = "Chief Petty Officer"; name[60] = "Second Chief Petty Officer"; name[61] = "Master Chief Petty Officer"; name[62] = "Fleet / Command Master Chief Petty Officer"; name[63] = "Master Chief Petty Officer of the Navy"; name[64] = "Chief Warrant Officer (CW02)"; name[65] = "Chief Warrant Officer (CW03)"; name[66] = "Chief Warrant Officer (CW04)"; var randomname0 = name[randomnumber0]; var randomname1 = name[randomnumber1]; var randomname2 = name[randomnumber2]; var randomname3 = name[randomnumber3]; var randomname4 = name[randomnumber4]; document.write(randomname0+'<br/>'+randomname1+'<br/>'+randomname2+'<br/>'+randomname3+'<br/>'+randomname4+'<br/>') var randomname = new Array(5); randomname[0] = name[randomnumber0]; randomname[1] = name[randomnumber1]; randomname[2] = name[randomnumber2]; randomname[3] = name[randomnumber3]; randomname[4] = name[randomnumber4]; var randomnamenum=Math.floor(Math.random()*4); var final=randomname[randomnamenum]; document.write('<br/><br/><pstyle="text-align:center"><strong>'+final+'</strong></style><br>') </script> </body> Good evening! After spending the last few days wrecking my brain over a simple JavaScript quiz I decided it was time I asked for help. The complete code is right beneath this post. The page will display brief instructions followed by a table containing the quiz. I'm having two rather peculiar problems. The first is with the Score() function which reads as follows: function Score(){ for(i=1;i<=10;i++) if(ans[i]== yourAns[i]) score++; prequiz.score.value= score; } Now unless I'm mistaken (which I am since the score isn't being tabulated correctly) this function essentially uses a for to cycle through both arrays, comparing the user's input against the array containing the right answers. If the contents within index i are the same on both arrays the score increases by one point. Once it cycles through the arrays, it passes score over to prequiz.score.value which will later pass this number to the text box that will display the grade to the user. The problem I'm experiencing is that the score will either be stuck at 2 or will display as 9 (even though all 10 answers were correct). Steps I've taken to try to solve this: Thinking it was the setAnsArray(question, answer) function I added a document.writeline to it. However it showed that the values were being passed correctly to the answer array. Added a document.writeline to the Score() function. Unlike the point above, score always displays as 00000 regardless of how many right answers I provide. The second issue I'm having is that the reset button is not working correctly. If I hit reset and answer the first question, the score will come back as double the score displayed before. Any insight into what is causing this issue is greatly appreciated! Code: <?xml version="1.0" encoding= "utf-8"?> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> <html xmlns= "http://www.w3.org/1999/xhtml"> <head> <title>Pre-Quiz!</title> <script type="text/JavaScript"> var ans= new Array(10); var yourAns= new Array(10); var score= 0; ans[0] = "b"; ans[1] = "c"; ans[2] = "c"; ans[3] = "a"; ans[4] = "d"; ans[5] = "c"; ans[6] = "c"; ans[7] = "a"; ans[8] = "b"; ans[9] = "c"; function setAnsArray(question, answer) { yourAns[question]= answer; } function Score(){ for(i=1;i<=10;i++) if(ans[i]== yourAns[i]) score++; prequiz.score.value= score; } </script> </head> <body> <h1>Pre-Quiz</h1> <p>The following test will allow you to evaluate your knowledge in programming prior to starting the course. After completing the test you will receive a score. Should you have any further doubts feel free to bring them with you on the first day of class.</p> </body> <form name="prequiz" action="JavaScript:Score()"> <center> <input type="submit" name="submit" value="Submit"> <input type="reset" name="reset" value= "Reset" /><br><br> </center> <b>Sco </b><input type="text" name="score" disabled=true><br> <hr> <center><table border="3" width="65%" summary= "Questions and options are organized in a table."> <thead> <tr> <th>Question</th> <th>Options</th> </tr> </thead> <tbody> <tr> <td><b>1. The following parameter code is used in which control structure?</b><br> (int i=0; i<= size; i++)<br> </td> <td><input type="radio" name="q1" value="a" onClick="setAnsArray(1, this.value)">a. If<br> <input type="radio" name="q1" value="b" onClick="setAnsArray(1, this.value)">b. For<br> <input type="radio" name="q1" value="c" onClick="setAnsArray(1, this.value)">c. Do-while<br> <input type="radio" name="q1" value="d" onClick="setAnsArray(1, this.value)">d. While</td> </tr> <tr> <td><b>2. What does the command "cout" do?</b><br></td> <td><input type="radio" name="q2" value="a" onClick="setAnsArray(2, this.value)">a. Obtains information from the user.<br> <input type="radio" name="q2" value="b" onClick="setAnsArray(2, this.value)">b. Closes the window.<br> <input type="radio" name="q2" value="c" onClick="setAnsArray(2, this.value)">c. Displays on screen.<br> <input type="radio" name="q2" value="d" onClick="setAnsArray(2, this.value)">d. Pauses a process.</td> </tr> <tr> <td><b>3. What is the origin of name Python? (referring to the programming language)</b><br></td> <td><input type="radio" name="q3" value="a" onClick="setAnsArray(3, this.value)">a. Creator had a pet python.<br> <input type="radio" name="q3" value="b" onClick="setAnsArray(3, this.value)">b. Named after a student of Plato.<br> <input type="radio" name="q3" value="c" onClick="setAnsArray(3, this.value)">c. Named after Monty Python's Flying Circus.<br> <input type="radio" name="q3" value="d" onClick="setAnsArray(3, this.value)">d. Creator was a fan of Greek mythology.</td> </tr> <tr> <td><b>4. What does HTML stand for?</b><br></td> <td><input type="radio" name="q4" value="a" onClick="setAnsArray(4, this.value)">a. HyperText Markup Language<br> <input type="radio" name="q4" value="b" onClick="setAnsArray(4, this.value)">b. Hyper Tools for Managing Languages<br> <input type="radio" name="q4" value="c" onClick="setAnsArray(4, this.value)">c. Heap Text Manager Lead<br> <input type="radio" name="q4" value="d" onClick="setAnsArray(4, this.value)">d. Horde Take Much Lore</td> </tr> <tr> <td><b>5. Who invented JavaScript?</b><br></td> <td><input type="radio" name="q5" value="a" onClick="setAnsArray(5, this.value)">a. Bill Gates<br> <input type="radio" name="q5" value="b" onClick="setAnsArray(5, this.value)">b. Isaac Newton<br> <input type="radio" name="q5" value="c" onClick="setAnsArray(5, this.value)">c. Elvis Java<br> <input type="radio" name="q5" value="d" onClick="setAnsArray(5, this.value)">d. Netscape</td> </tr> <tr> <td><b>6. What is a variable?</b><br></td> <td><input type="radio" name="q6" value="a" onClick="setAnsArray(6, this.value)">a. An unknown.<br> <input type="radio" name="q6" value="b" onClick="setAnsArray(6, this.value)">b. A value that changes.<br> <input type="radio" name="q6" value="c" onClick="setAnsArray(6, this.value)">c. The name for a place in the computer's memory where a certain data is stored.<br> <input type="radio" name="q6" value="d" onClick="setAnsArray(6, this.value)">d. Part of an algebraic expression.</td> </tr> <tr> <td><b>7. What is a compiler?</b><br></td> <td><input type="radio" name="q7" value="a" onClick="setAnsArray(7, this.value)">a. Converts the target file into a .zip .<br> <input type="radio" name="q7" value="b" onClick="setAnsArray(7, this.value)">b. Gathers all documents in one.<br> <input type="radio" name="q7" value="c" onClick="setAnsArray(7, this.value)">c. A program or set of programs that transforms source code from programming language into another computer language.<br> <input type="radio" name="q7" value="d" onClick="setAnsArray(7, this.value)">d. Secret ingridient in KFC's chicken</td> </tr> <tr> <td><b>8. Define portability:</b><br></td> <td><input type="radio" name="q8" value="a" onClick="setAnsArray(8, this.value)">a. Characteristic attributed to a program if it can be used in another OS different from the one it was created in without requiring major rework.<br> <input type="radio" name="q8" value="b" onClick="setAnsArray(8, this.value)">b. Ease to transport the program's disks.<br> <input type="radio" name="q8" value="c" onClick="setAnsArray(8, this.value)">c. How big the size of the program is.<br> <input type="radio" name="q8" value="d" onClick="setAnsArray(8, this.value)">d. Time required to download a program.</td> </tr> <tr> <td><b>9. What is an executable file?</b><br></td> <td><input type="radio" name="q9" value="a" onClick="setAnsArray(9, this.value)">a. A text document containing code.<br> <input type="radio" name="q9" value="b" onClick="setAnsArray(9, this.value)">b. A file in a format the computar can directly execute.<br> <input type="radio" name="q9" value="c" onClick="setAnsArray(9, this.value)">c. A virus.<br> <input type="radio" name="q9" value="d" onClick="setAnsArray(9, this.value)">d. A malicious program.</td> </tr> <tr> <td><b>10. Which of the following is not a programming language? </b><br></td> <td><input type="radio" name="q10" value="a" onClick="setAnsArray(10, this.value)">a. HTML<br> <input type="radio" name="q10" value="b" onClick="setAnsArray(10, this.value)">b. Lua<br> <input type="radio" name="q10" value="c" onClick="setAnsArray(10, this.value)">c. Moolah<br> <input type="radio" name="q10" value="d" onClick="setAnsArray(10, this.value)">d. C++</td> </tr> </tbody> </table></center> </form> </html> Hi! I'm trying to make a multiple choice quiz using javascript. I downloaded codes from http://www.javascriptkit.com/script/cut180.shtml But when I used it nothing comes up on the results (number of correct answer, number of wrong answer and percentage) as well as the solution box is empty. I tried it on Google Chrome and it says "Your browser does not accept cookies. Please adjust your settings." So I tried it in Safari because that's what we use in school and it doesn't work. The results and solution box is empty. I am guessing that problem is with cookies? Please help me. Here are my codes: - Quiz //Enter total number of questions: var totalquestions=10 //Enter the solutions corresponding to each question: var correctchoices=new Array() correctchoices[1]='a' //question 1 solution correctchoices[2]='d' //question 2 solution, and so on. correctchoices[3]='b' correctchoices[4]='b' correctchoices[5]='c' correctchoices[6]='b' correctchoices[7]='a' correctchoices[8]='c' correctchoices[9]='d' correctchoices[10]='b' /////Don't edit beyond here////////////////////////// function gradeit(){ var incorrect=null for (q=1;q<=totalquestions;q++){ var thequestion=eval("document.myquiz.question"+q) for (c=0;c<thequestion.length;c++){ if (thequestion[c].checked==true) actualchoices[q]=thequestion[c].value } if (actualchoices[q]!=correctchoices[q]){ //process an incorrect choice if (incorrect==null) incorrect=q else incorrect+="/"+q } } if (incorrect==null) incorrect="a/b" document.cookie='q='+incorrect if (document.cookie=='') alert("Your browser does not accept cookies. Please adjust your browser settings.") else window.location="results.htm" } function showsolution(){ var win2=window.open("","win2","width=200,height=350, scrollbars") win2.focus() win2.document.open() win2.document.write('<title>Solution</title>') win2.document.write('<body bgcolor="#FFFFFF">') win2.document.write('<center><h3>Solution to Quiz</h3></center>') win2.document.write('<center><font face="Arial">') for (i=1;i<=totalquestions;i++){ for (temp=0;temp<incorrect.length;temp++){ if (i==incorrect[temp]) wrong=1 } if (wrong==1){ win2.document.write("Question "+i+"="+correctchoices[i].fontcolor("red")+"<br>") wrong=0 } else win2.document.write("Question "+i+"="+correctchoices[i]+"<br>") } win2.document.write('</center></font>') win2.document.close() } ______________________________________________________________ For Results <html> <head> <title>Instant Quiz Results</title> </head> <body bgcolor="#FFFFFF"> <p align="center"><strong><font face="Arial"> <script src="quizconfig.js"> </script>Quiz Results Summary</font></strong></p> <div align="center"><center> <table border="0" cellspacing="0" cellpadding="0"> <tr> <td width="100%"><form method="POST" name="result"><table border="0" width="100%" cellpadding="0" height="116"> <tr> <td height="25" bgcolor="#D3FFA8"><strong><font face="Arial">Number Of Correct Questions:</font></strong></td> <td height="25"><p><input type="text" name="p" size="24"></td> </tr> <tr> <td height="17" bgcolor="#D3FFA8"><strong><font face="Arial">Wrong Questions:</font></strong></td> <td height="17"><p><textarea name="T2" rows="3" cols="24" wrap="virtual"></textarea></td> </tr> <tr> <td height="25" bgcolor="#D3FFA8"><strong><font face="Arial">Grade Percentage:</font></strong></td> <td height="25"><input type="text" name="q" size="8"></td> </tr> </table> </form> </td> </tr> </table> </center></div> <form method="POST"><div align="center"><center><p> <script> var wrong=0 for (e=0;e<=2;e++) document.result[e].value="" var results=document.cookie.split(";") for (n=0;n<=results.length-1;n++){ if (results[n].charAt(1)=='q') parse=n } var incorrect=results[parse].split("=") incorrect=incorrect[1].split("/") if (incorrect[incorrect.length-1]=='b') incorrect="" document.result[0].value=totalquestions-incorrect.length+" out of "+totalquestions document.result[2].value=(totalquestions-incorrect.length)/totalquestions*100+"%" for (temp=0;temp<incorrect.length;temp++) document.result[1].value+=incorrect[temp]+", " </script> <input type="button" value="Retake Quiz" name="B1" onClick="history.go(-1)"> <input type="button" value="Show Solution" name="B2" onClick="showsolution()"></p> </center></div> </form> </body> </html> Please help me. I've been trying to find out what is wrong with my codes for a week. Thanks in advance! |