JavaScript with multiple choices. Element for displaying correct answers

function HideSectionTwo() {

    // If correct answers are checked 
    if(document.getElementById("S1Q1A").checked == true)  {
        document.getElementById("sectiontwo").style.display = "";

    }
    //else if nothing is checked
    else {
        document.getElementById("sectiontwo").style.display = "none";
    } 
}

I'm new to JavaScript, but I'm trying to create a multi-choice quiz with 4 questions in each section. After all the answers have been correctly edited in this section, it will display the next section. For my HTML, I use tables and store the entire section in these separate tables that have the identifier "sectionone", "sectiontwo", etc. The code above is what I was working on. I tried getElementByClass and assigned my element names to classes, but that didn't work. I'm just stuck and need to understand which direction to go.

script . 1 1 , "sectiontwo".

+4
1

, , , , , . - :

//count of questions answered
var s1count = 0;
//question 1
if (document.getElementById('S1Q1A').checked || document.getElementById('S1Q1B').checked || document.getElementById('S1Q1C').checked || document.getElementById('S1Q1D').checked) {
  s1count++;
}
//question 2
if (document.getElementById('S1Q2A').checked || document.getElementById('S1Q2B').checked || document.getElementById('S1Q2C').checked || document.getElementById('S1Q2D').checked) {
  s1count++;
}
//and so on...

//check the count, say if section 1 has 5 questions
if (s1count == 5) {
  document.getElementById("sectiontwo").style.display = "block"; //or inline
}
+1

All Articles