如何检查是否选择了所有单选按钮?

时间:2014-01-28 21:27:11

标签: javascript jquery html

我正在尝试构建一个包含单选按钮的网页。我正在使用jquery检查是否已选中所有单选按钮。这是代码:

<body>
<p class="Cal">Welcome,</p>
<hr />
<p class="Radio1">Answer the questions below. You will find the results after clicking 'Check my score'.</p>
<hr />
<form method="post">
<p class="Question">1. Do you sleep early at night? (Anywhere around 9-10pm)</p>
<p>
<label>
  <span class="Radio">
  <input type="radio" name="RadioGroup1" value="Yes" id="RadioGroup1_0" />
</span></label>
<span class="Radio">    Yes
<br />
<label>
  <input type="radio" name="RadioGroup1" value="No" id="RadioGroup1_1" /> 
  No
</label>
<br />
<label>
  <input type="radio" name="RadioGroup1" value="Sometimes" id="RadioGroup1_2" />
  Sometimes    </label>
</span><br />
</p>
<p class="Question">2. Do you wake up early in morning?(Anywhere around 5-7am)</p>
<p>
<label>
  <span class="Radio">
  <input type="radio" name="RadioGroup2" value="Yes" id="RadioGroup2_0" /> 
  Yes      </span></label>
<span class="Radio"><br />
  <label>
  <input type="radio" name="RadioGroup2" value="No" id="RadioGroup2_1" /> 
  No
</label>
<br />
<label>
  <input type="radio" name="RadioGroup2" value="Sometimes" id="RadioGroup2_2" /> 
  Sometimes
</label>
</span><br />
</p><input type="submit" value="Check my score" /></form></body>

有30个这样的问题。我的jquery代码如下:

$(document).on('submit', 'form', function () {
var validate = true;
var unanswered = new Array();

// Loop through available sets
$('.Radio').each(function () {
    // Question text
    var Question = $(this).prev().text();
    // Validate
    if (!$(this).find('input').is(':checked')) {
        // Didn't validate ... dispaly alert or do something
        unanswered.push(Question);

        validate = false;
    }
});

if (unanswered.length > 0) {
    msg = "Please answer the following questions:\n" + unanswered.join('\n');
    alert(msg);
}
else{
    msg = "Done!";
    alert(msg);
}
return validate;
});

现在我尝试了所有可行的方法来完成这项工作。但即使在我检查每个答案的单选按钮后,我仍然会弹出“请回答以下问题:”然后是一个空白列表。我从未收到“完成!”的消息。即使检查了所有问题的答案。 故障在哪里?

1 个答案:

答案 0 :(得分:0)

您可以使用HTML5 required属性,这是更好的选择。 您还可以使用JavaScript循环并使用

从每个广播组中检索值
$("input:radio[name=radiogroupX]:checked")