我正在制作一个考试-测试模块。其中将有不止一个问题。每个问题都有多个选择答案。我一次只显示一个问题。在出现最后一个问题之前,将会有一个名为“下一步”的按钮。如果没有其他问题,该按钮将显示Submit Test
。当用户点击Submit Test
按钮时,所有问题的所有答案都会传递给后台的PHP函数,以检查有多少正确和错误?我试着做以下事情,但我得到的数组只有一个答案和第一个问题的答案。我如何才能做到这一点?我想将所有问题的答案存储在一个数组中,然后通过AJAX、.post
调用或jQuery调用将该数组传递给PHP函数。
index.php
<div class="modal fade test-modal" id="Test">
<div class="modal-dialog">
<div class="modal-content">
<? foreach ($questions as $i=>$question) { ?>
<div class='question'>
<div class="modal-header">
<div class="row">
<h4>QUIZ</h4>
</div>
</div>
<div class="modal-body">
<div class="row">
<div class="quest">
<ul class="list-unstyled">
<? foreach ($question->getAnsChoice as $answer) { ?>
<li>
<div class="checkbox">
<input class="cb" type="checkbox" name="answer[]" value="<?=$answer->title?>">
<?=$answer->title?>
</div>
</li>
<? } ?>
</ul>
<br>
<br>
<p class='error'>Please select an answer</p>
</div>
</div>
</div>
<div class="modal-footer">
<p class='quest_num'><?=$question->number?> of <?=count($questions)?></p>
<? if( count($questions) === 1 ) { ?>
<a id="submit_quiz" class="btn button btn-lg quiz-btn">Submit Test</a>
<? } else if ( count($questions) === $i +1 ) { ?>
<a id="submit_quiz" class="btn button btn-lg quiz-btn">Submit Test</a>
<? } else { ?>
<a class=" btn button btn-lg quiz-btn">Next Question</a>
<? } ?>
</div>
</div>
<? } ?>
</div>
</div>
</div>
javascript
<script type="text/javascript">
$(document).on('ready', function(){
$('.quiz-btn').click(function(e){
e.preventDefault()
var checkbox = $(this).parents('.question').children('.modal-body').children('.row').children('.quest').children('ul').children('li').children('.checkbox').children('.icheckbox_square');
var btn = $(this).parents('.question').children('.modal-footer').children('.quiz-btn')
var next = false
var submit = false
var answers = [];
$(checkbox).each(function(){
if ( $(this).hasClass('checked') && $(btn).html() == 'Next Question' ) {
answers.push($('.cb:checked').val());
next = true
}
else if ($(this).hasClass('checked') && $(btn).html() == 'Submit Test') {
submit = true
}
});
if ( next ) {
e.preventDefault();
$(this).parents('.question').slideUp(500);
$(this).parents('.question').next('.question').delay(500).slideDown(500);
} else if ( submit ) {
e.preventDefault();
$.post('/student/submit_quiz',{asnwers: answers}, function(data){
});
} else {
console.log(next)
$('.quest .error').fadeIn();
}
});
}
</script>
https://stackoverflow.com/questions/51051345
复制相似问题