Question

Requirements For quiz must meet the following requirements: At least 5 questions, such as with radio...

Requirements

For quiz must meet the following requirements:

  • At least 5 questions, such as with radio buttons or checkboxes
  • Visual hints if the user requests it
  • Visual feedback for correct and incorrect answers
  • Summary assessment based on the score

Extra Challenges

Consider the follow additions for a snazzier quiz:

  • Animated feedback
  • Remove incorrect answers to highlight correct answers
  • Use of additional controls for providing answers and requesting feedback

HTML CODE




Control Examples


src="http://code.jquery.com/jquery-3.3.1.js"
integrity="sha256-2Kok7MbOyxpgUVvAk/HJ2jigOSYS2auK4Pfzbm7uH60="
crossorigin="anonymous">

Control Examples


What is your favorite color?

Blue

Red


  


What is your favorite flavors?


Vanilla


Chocolate


Kiwi


  



  


Results

<br />

JAVA CODE

$(function() {
var attemptCount;
attemptCount = 0;
  
$("#checkButton").click(function() {
var count;
count = 0;
attemptCount = attemptCount + 1;
  
// clear results box
// document.getElementById("results").value = "";
$("#results").val("");
  
// check if Blue is checked
if ($('#blueItem').prop("checked")) {
count = count + 1;
$('#results').val(
$('#results').val() + "Blue is checked" + "\n"
);
}
else {
count = count - 10;   
}
  
// check if Kiwi is selected
if ($('#kiwiItem').prop("checked")) {
count = count + 1;
}
if ($('#ElevenItem').prop("checked")) {
count = count + 1;
}
$('#results').val(
$('#results').val() + "You got " + count + " correct." + "\n"
);
$('#results').val(
$('#results').val() + "Number of attempts: " + attemptCount + "\n"

);
});
});
  

0 0
Add a comment Improve this question Transcribed image text
Answer #1

Here is code:

<!DOCTYPE html>

<html>

<head>

<title>Do you know?</title>

<script src="https://code.jquery.com/jquery-2.2.4.js" integrity="sha256-iT6Q9iMJYuQiMWNd9lDyBUStIq/8PuOW33aOqmvFpqI="

crossorigin="anonymous"></script>

<script>

function findAnswer(question,answer,choice) {

if(choice === answer){

$("input[name='"+question+"']").not("input[value='"+ answer +"']").parent().hide();

$("input[value='"+ answer +"']").parent().css("color","green");

return 10;

}else{

$("input[name='"+question+"']").not("input[value='"+answer+"']").parent().hide();

$("input[value='"+ answer +"']").parent().css("color","red");

return -5;

}

}

function checkQuiz(){

var totalScore = 0; //default the score to zero points

var answer1 =$("input[name='question1']:checked").val()

var answer2 =$("input[name='question2']:checked").val()

var answer3 =$("input[name='question3']:checked").val()

var answer4 =$("input[name='question4']:checked").val()

var answer5 =$("input[name='question5']:checked").val()

if(answer1 == null || answer2 == null || answer3 == null|| answer4 == null|| answer5 == null){

alert("Please select the answers")

return;

}else{

//Award points based on which answer is true

totalScore += findAnswer("question1","Ireland",answer1);

totalScore += findAnswer("question2","November",answer2);

totalScore += findAnswer("question3","12",answer3);

totalScore += findAnswer("question4","Blue",answer4);

totalScore += findAnswer("question5","Kiwi",answer5);

//Output the score to the user

document.getElementById("score").innerHTML = "Your total score is " + totalScore;

}

}

var hint = [

"Dublin is capital of it",

"Its 10th month",

"Its a sequence number ",

"Color of sky",

"Its a bird name also",

]

function giveHint(id) {

$("#spHint" + id).text(hint[id]);

}

</script>

</head>

<body>

<p>

Dublin is the capital of which country? <br>

<div> <input type="radio" name="question1" value="Iceland" id="q1_1"> Iceland </div>

<div> <input type="radio" name="question1" value="United Kingdom" id="q1_2"> United Kingdom </div>

<div> <input type="radio" name="question1" value="France" id="q1_3"> France </div>

<div> <input type="radio" name="question1" value="Ireland" id="q1_4"> Ireland </div>

</p>

<div><button onclick="giveHint(0)">Hint</button>

<span id="spHint0"></span>

</div>

<p>

Halloween is in which month? <br>

<div><input type="radio" name="question2" value="September" id="q1_2"> September </div>

<div><input type="radio" name="question2" value="October" id="q1_3"> October </div>

<div><input type="radio" name="question2" value="November" id="q1_1"> November </div>

<div><input type="radio" name="question2" value="January" id="q1_4"> January </div>

</p>

<div><button onclick="giveHint(1)">Hint</button>

<span id="spHint1"></span>

</div>

<p>

What is the square root of 144? <br>

<div><input type="radio" name="question3" value="14" id="q1_2"> 14 </div>

<div><input type="radio" name="question3" value="12" id="q1_1"> 12 </div>

<div><input type="radio" name="question3" value="11" id="q1_3"> 11 </div>

<div><input type="radio" name="question3" value="4" id="q1_4"> 4 </div>

</p>

<div><button onclick="giveHint(2)">Hint</button>

<span id="spHint2"></span>

</div>

<p>

What is your favorite color? <br>

<div> <input type="radio" name="question4" value="Blue" id="q1_1"> Blue </div>

<div> <input type="radio" name="question4" value="Red" id="q1_2"> Red </div>

</p>

<div><button onclick="giveHint(3)">Hint</button>

<span id="spHint3"></span>

</div>

<p>

What is your favorite flavors? <br>

<div> <input type="radio" name="question5" value="Vanilla" id="q2_1"> Vanilla </div>

<div> <input type="radio" name="question5" value="Chocolate" id="q2_2"> Chocolate </div>

<div> <input type="radio" name="question5" value="Kiwi" id="q2_3"> Kiwi </div>

</p>

<div><button onclick="giveHint(4)">Hint</button>

<span id="spHint4"></span>

</div>

<p>

<input type="submit" value="Check Answers" OnClick="checkQuiz()">

</p>

<h1 id="score">Ready to Play?</h1>

</body>

</html>

Output:

Add a comment
Know the answer?
Add Answer to:
Requirements For quiz must meet the following requirements: At least 5 questions, such as with radio...
Your Answer:

Post as a guest

Your Name:

What's your source?

Earn Coins

Coins can be redeemed for fabulous gifts.

Not the answer you're looking for? Ask your own homework help question. Our experts will answer your question WITHIN MINUTES for Free.
Similar Homework Help Questions
ADVERTISEMENT
Free Homework Help App
Download From Google Play
Scan Your Homework
to Get Instant Free Answers
Need Online Homework Help?
Ask a Question
Get Answers For Free
Most questions answered within 3 hours.
ADVERTISEMENT
ADVERTISEMENT