验证是否已选中所有单选按钮，或者验证按钮是否未单击

Question

I am very new to Javascript and I have this Javascript function that is called on button click. What I want to do is show an alert if ALL the radio buttons have NOT been selected wether they are Yes or No and if they have ALL been selected call another function called addPoints() below.

function validateForm(){

    var inputs = document.querySelectorAll('input[type="radio"]');
       var  formValid = false;
       for(var i=0;i<inputs.length;i++){
           if(inputs[i].checked){
               formValid  = true;

            }
       }
      if(!formValid ){   
           alert("Please answer all questions!");
       }

else{

addPoints();

}
} 

Below is how my radio buttons are presented

<form name="form1" id="form1">
<input id="rdo1" type="radio" name="q1" value="10">Yes<br>
<input id="rdo2" type="radio" name="q1" value="0">No
</form>

<form name="form2" id="form2">
<input id="rdo3" type="radio" name="q2" value="10">Yes<br>
<input id="rdo4" type="radio" name="q2" value="0">No
</form>

 <form name="form3" id="form3">
<input id="rdo5" type="radio" name="q3" value="10">Yes<br>
<input id="rdo6" type="radio" name="q3" value="0">No
</form>

<button type="submit" onclick="validateForm()">Score?</button>

If I do not select any radio button when the page loads and I call the function validateForm() using the button the message is correct and states "Please answer all questions". If I select either YES or NO from any group it calls the addPoints function. I only want it to call that function when ALL either Yes or Nos have been selected from All radio groups.

Answer 1

DEMO

Code:

function addPoints() {
    alert("Adding points");
}

function validateForm() {

    var inputs = document.querySelectorAll('input[type="radio"]'),
        // An empty array
        checker = [];

    for (var i = 0; i < inputs.length; i++) {
        if (inputs[i].checked) {
            // Whenever find a checked element, push it in checker array
            checker.push(true);
        }
    }

    // Since, there are only 3 radio groups, according to OP,
    // call addPoints when all 3 (yes/no) have been selected
    if (checker.length === 3) {
        addPoints();
    }
    // Show an alert if none has been selected
    else if (checker.length === 0) {
        alert("Please answer all questions!");
    } else {
        // Add something you may want
    }
}

Answer 2

而不是遍历每个单选按钮，而是遍历每个表单，并在每个表单中遍历单选按钮

Answer 3

You Can do it using Jquery Like this I used Check Boxes :)

function validateForm(){

  if($('input[type="checkbox"]:checked').length != $('input[type="checkbox"]').length){
               alert("Please answer all questions!");
        }else{
               alert("ok!");
     }
}