https://jsfiddle.net/dz3awLz5/253/

Community Off Topic
1

I’m trying to make a quiz, but the code I’ve written isn’t doing what I want it to do. I would appreciate any help!

2

The code has nothing to do with a quiz, but static information.

3

lets include the fiddle a bit more easy to access:

https://jsfiddle.net/dz3awLz5/253/

you have a JS section to work in, which gives nice error message, and then you decide to put in script tag in html file? Pity

you can’t have else if after else, else covers all remaining scenarios, how can there be anything left after that?

4

Then it looks like spam. The link in the header is the best place to have it, imho.

5

I was taking (another) JavaScript tutorial but on http://www.s2js.com/ this time, and I noticed the else-if-after-if code was used in an example

6

but then it isn’t clickable?

7

else if after if is fine, else if after else like in your code isn’t. The order is always:

if
else if
else
1 Like
8

Also, this is the first time I’ve actually used JavaScript outside of a tutorial, so…be easy on me please :sweat_smile:

9

If you put the JS code in the section its meant for on jsfiddle (bottom left), Jsfiddle will give you an error that you can’t have else if after else (you have this in your code)

don’t make things unnecessary complicated for yourself.

10

Okay, thanks. So what would be a better format?

Edit: better format for the questions than what I have?

11

what do you mean? Your question is fine, but i also answered it? You messed up the order of if/else if/else, its always:

if (something){ do something}
else if (something different} { do something different} // you can repeat this one
else { do something else}
12

Right, I then formatted the code like this, but I’m still trying to solve how to include the conditional statements (the code I made into comments):

<script>
	function Submit (){
	if (answerOne == 2){
			text.innerHTML ="That's right!";
			}
  	//else{
    	//text.innerHTML = "Incorrect! The answer is 2."
    //}
   else if (answerTwo == 1){
    	text2.innerHTML= "That's right!";
   	  }
		//	else{
      //text2.innerHTML="Incorrect! The answer is 1."
      //}
   if (answerThree== 1){
  		text3.innerHTML="That's right!";
   		}
   		//else{
      //text3.innerHTML="Incorrect! The answer is 1."
      //}
     
   else if (answerFour == 3){
    	text4.innerHTML="That's right!";
    }
  	//	else{
      //text4.innerHTML="Incorrect! The answer is 3."
    //  }
  }
  
</script>`Preformatted text`
13

you can have an if/else statement for the different answers, but then you don’t need else if

14

Actually, it is, and even has the offsite location icon.

1 Like
15

Let’s start off by modeling a single question and just getting it to display if the user has chosen the correct answer or not.

The following has four possible inputs (radio buttons) that once clicked will reveal their correctness. This will log all output to the console as it updates the display:

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width">
    <title>Quiz Template</title>
    <script src="http://code.jquery.com/jquery-3.3.1.slim.min.js"></script>
  </head>
  <body>
    <section id="q1">
      <h3>Question 1</h3>
      <p>What is the capital of Uruguay?</p>
      <label for="q1a">San Jose</label>
	  <input type="radio" name="q1" id="q1a" value="Incorrect">
      <label for="q1b">Colonia</label>
	  <input type="radio" name="q1" id="q1b" value="Incorrect">
      <label for="q1c">Maldonado</label>
	  <input type="radio" name="q1" id="q1c" value="Incorrect">
      <label for="q1d">Montevideo</label>
	  <input type="radio" name="q1" id="q1d" value="Correct">
      <p class="response"></p>
    </section>
    <script src="index.js"></script>
  </body>
</html>

index.js

$(document).ready(function () {
  $('#q1').on('change', 'input', function (e) {
    //$response = $('#q1 .response');
    //$response = $(this).parent().children().last();
    $response = $(this).siblings().last();
    $response.text($(this).val());
    console.log($(this).val());
  });
});

Above are shown three possible ways to hook the response element.

Quiz Template View