Ok before i make spaghetti of this code i thought id ask around here. ive made a quiz for an online site.
The answers are stored in an array, and ive a function that checks
the answers array
to what youve clicked. then it counts them and gives you your score.
but i want
to change the clor of
the right answer wen
the user clicks
the score button. so
the correct answers are highlighted. something like this https://www.shutterpoint.com/Home-Quiz.cfm (just hit submit at
the bottom, no need
to do
the quiz).
the little answer icon at
the side looks flashy but id rather just have
the text
change color. heres
how my questions are formatted
<p>Depth of field is controlled by :?</p>
<p id = "question2"><input type="radio" name="question2" id="Answer1" value = "a" onClick ="recordAnswer(2,this.value)"/>
The focal length of
the lens. <br/>
<input type="radio" name="question2" id="Answer2" value = "b" onClick = "recordAnswer(2,this.value)"/>
The size of
the aperture opening. <br/>
<input type="radio" name="question2" id="Answer3" value = "c" onClick = "recordAnswer(2,this.value)"/>
The distance between
the camera and lens. <br/>
<input type="radio" name="question2" id="Answer4" value = "d" onClick = "recordAnswer(2,this.value)"/> All of these. <br/></p>
and these are
the two functions that are called throughout. record answer is called every time
the user clicks a button
function recordAnswer(question,answer)
{
answers[question-1] = answer;
}
this is
the final button which calculates
the score
function scoreQuiz()
{
var totalCorrect = 0;
for(var count = 0; count<correctAnswers.length;count++)
{
if(answers[count]== correctAnswers[count])
totalCorrect++;
}
<!--
alert("You scored " + totalCorrect + " out of 12 correct!");
-->
}
another function is best i think. ive already made attemots at it and know i have
to set
the color using
document.getElementById('question2').style.color = '#0000ff';
question2 being
the p id
i think if i take in
the value part of (input type....) ill be able
to compare it
to the answers array.
but im not quite sure
how to do this. any helpers?
maybe something like this
document.getElementById("Answer1").style.color = '#0000ff';
using
the id part of
the (input type line)
i think i got it actually. ill post my answer in a sec
