javascript functions
Ravichandran J ๐ฎ๐ณ๐ฎ๐ณ๐ฎ๐ณ๐ฎ๐ณ
Posted on January 31, 2024
My js file is given below:
var pos = 0;
var board = document.getElementById('board');
var status = document.getElementById('status');
var questn, choice, A, B, C, D, cor = 0;
var questions = [
["Shortcut of copy", "CTRL+A", "CTRL+S", "CTRL+C", "CTRL+Z", "C"],
["10+10", "20", "30", "40", "50", "A"],
["10+20", "20", "30", "40", "50", "B"],
["10+30", "20", "30", "40", "50", "C"]
];
var incorrectAnswers = [];
function DisplayQuestion() {
board.innerHTML = "";
status.innerHTML = "Question " + (pos + 1) + " of " + questions.length;
questn = questions[pos][0];
A = questions[pos][1];
B = questions[pos][2];
C = questions[pos][3];
D = questions[pos][4];
board.innerHTML += "
" + questn + "
";board.innerHTML += "" + A + "
";
board.innerHTML += "" + B + "
";
board.innerHTML += "" + C + "
";
board.innerHTML += "" + D + "
";
board.innerHTML += "Submit Answer";
}
function checkAnswer() {
var choice;
var choices = document.getElementsByName("choices");
var choiceSelected = false;
for (var i = 0; i < choices.length; i++) {
if (choices[i].checked) {
choice = choices[i].value;
choiceSelected = true;
break;
}
}
if (!choiceSelected) {
alert("Please select an answer before submitting.");
return;
} else {
var correctAnswer = questions[pos][5];
if (choice === correctAnswer) {
cor++;
} else {
incorrectAnswers.push({
questionIndex: pos,
userChoice: { letter: choice, value: questions[pos][parseInt(choice, 10)] },
correctAnswer: { letter: correctAnswer, value: questions[pos][parseInt(correctAnswer, 10)] }
});
}
pos++;
if (pos >= questions.length) {
DisplayResult();
} else {
DisplayQuestion();
}
}
}
function DisplayResult() {
board.innerHTML = "
You got " + cor + " questions out of " + questions.length + "
";status.innerHTML = "Quiz completed";
for (var i = 0; i < incorrectAnswers.length; i++) {
var questionIndex = incorrectAnswers[i].questionIndex;
var userChoice = incorrectAnswers[i].userChoice;
var correctAnswer = incorrectAnswers[i].correctAnswer;
board.innerHTML += "<h3>Question: " + questions[questionIndex][0] + "</h3>";
board.innerHTML += "Your Answer: " + userChoice.letter + " (" + userChoice.value + ")" + "<br>";
board.innerHTML += "Correct Answer: " + correctAnswer.letter + " (" + correctAnswer.value + ")" + "<br><br>";
}
}
The DisplayResult function works wrongly. It gives output as :
You got 2 questions out of 4
Question: Shortcut of copy
Your Answer: A (undefined)
Correct Answer: C (undefined)
Question: 10+20
Your Answer: C (undefined)
Correct Answer: B (undefined).
I want to have the actual values of user's choice and correct answer, instead of displaying Option values.
Please help.
Posted on January 31, 2024
Join Our Newsletter. No Spam, Only the good stuff.
Sign up to receive the latest update from our blog.
Related
November 30, 2024