所以我正在设置一个测验 - 每个问题都有一系列3个单选按钮。我想使用jQuery验证来确保用户每个问题至少检查了一个答案。
这是我的HTML
<!-- Question 1 -->
<div class="large-12 questions" id="question-1">
<h5>Question 1</h5>
<label><input type="radio" name="radio-one" value="340,000">Answer</label>
<label><input type="radio" name="radio-one" value="6 million">Answer</label>
<label><input type="radio" name="radio-one" value="11 million" class="correct-answer">Answer</label>
</div>
<!-- Question 2 -->
<div class="large-12 questions" id="question-2">
<h5>Question 2</h5>
<label><input type="radio" name="radio-two" value="1 in 2,000">Answer</label>
<label><input type="radio" name="radio-two" value="1 in 1,400">Answer</label>
<label><input type="radio" name="radio-two" value="1 in 500" class="correct-answer">Answer</label>
</div>
<!-- Question 3 -->
<div class="large-12 questions" id="question-3">
<h5>Question 3</h5>
<label><input type="radio" name="radio-three" value="Every day">Answer</label>
<label><input type="radio" name="radio-three" value="Every 6 hours">Answer</label>
<label><input type="radio" name="radio-three" value="Every 83 minutes" class="correct-answer">Answer</label>
</div>
<!-- Question 4 -->
<div class="large-12 questions" id="question-4">
<h5>Question 4</h5>
<label><input type="radio" name="radio-four" value="2%">Answer</label>
<label><input type="radio" name="radio-four" value="11%">Answer</label>
<label><input type="radio" name="radio-four" value="20%" class="correct-answer">Answer</label>
</div>
<!-- Question 5 -->
<div class="large-12 questions" id="question-5">
<h5>Question 5</h5>
<label><input type="radio" name="radio-five" value="X%">Answer</label>
<label><input type="radio" name="radio-five" value="XX%" class="correct-answer">Answer</label>
<label><input type="radio" name="radio-five" value="X.X%">Answer</label>
</div>
这是我的main.js代码
$('.questions').each(function(){
if($('#question input:radio').is(':checked')){
alert('this works');
} else {
alert('you missed one');
}
当我运行此代码时,如果我留下一个“未答复”的问题,我会收到5条提示“你错过了一个”。如何更改我的JavaScript,以便如果只有一个问题未得到答复,它会提醒用户?
感谢。
答案 0 :(得分:0)
如果从回调中返回each
,jQuery false
函数将提前停止循环。 (这类似于正常循环中的break
指令。)如果将错误分支更新为
alert('you missed one');
return false;
然后不会检查其他元素。
答案 1 :(得分:0)
#question
不存在。它应该是$(this).find('input:radio')
。alert('You missed ' + $(this).find('h5').text());
提醒错过的问题编号。完整代码:
$('.questions').each(function() {
if ($(this).find('input:radio').is(':checked')) {
alert('This works ' + $(this).find('h5').text());
} else {
alert('You missed ' + $(this).find('h5').text());
}
});
答案 2 :(得分:0)
要一次只获取一条警报消息,请使用以下代码:
$('.questions').each(function(){
if($(this).find('input[type="radio"]').is(':checked') === false){
alert($(this).find('h5').text()+' is missed!');
return false;
}
});