请我想显示一个问题，在一个页面上我的问答应用程序与下一步和上一步按钮。我能做到这一点。我做的是，我在每个问题上加了一个id。每个问题id的初始值为1。所以在next按钮函数中，我将每个问题的值增加1。因此，当单击“下一步”或“上一步”按钮时，它会将问题的id增加或减少1，然后决定在页面上显示哪个问题。另外，如果问题id为1，则“下一步”按钮应显示和隐藏上一步按钮。但如果id大于1或小于问题总数，则应显示“下一步”和“上一步”按钮。但我现在面临的新挑战是，当问题超过10个时，它会在一页上显示两个问题，而“完成”按钮不会显示。finish按钮应该显示当前问题id（可以是任何值）是否等于我获取或要显示的问题总数。例如，如果当前问题id为20，而我要显示的问题总数为20，则应该显示finish按钮。否则应该显示下一个和上一个。
This is my code
<form method="POST" role="form" id="form" action="result.php">
<?php
$number_of_question = 10;
$qryquestions="SELECT * FROM questions WHERE `course_title`='".$course_title."' ORDER BY RAND() LIMIT 10";
$qryquestionscheck=$conn->query($qryquestions);
$i = 1;
foreach ($qryquestionscheck as $row){
$question_id = $row['question_id'];
$questions = $row['questions'];
$optionA = $row['option_A'];
$optionB = $row['option_B'];
$optionC= $row['option_C'];
$optionD = $row['option_D'];
$correct_answer = $row['answer'];
$_SESSION['course_title'] = $course_title;
$question_rowcount = $qryquestionscheck->num_rows;
$remainder = $question_rowcount/$number_of_question;
$_SESSION['question_rowcount'] = $question_rowcount;
//echo $remainder; die();
?>
<?php if($i==1){?>
<div id='question<?php echo $i;?>' class='cont'>
<div class="form-group">
<label style="font-weight: normal; text-align: justify;" class="questions"><b><?php echo "Question" . " " . $counter++; ?></b> <?php echo $questions; ?></label><br>
<div id="quiz-options">
<label style="font-weight: normal; cursor: pointer;">
<input type="checkbox" name="option[]" value="A"> <?php echo $optionA; ?>
</label><br>
<label style="font-weight: normal; cursor: pointer;">
<input type="checkbox" name="option[]" value="B"> <?php echo $optionB; ?>
</label><br>
<label style="font-weight: normal; cursor: pointer;">
<input type="checkbox" name="option[]" value="C"> <?php echo $optionC; ?>
</label><br>
<label style="font-weight: normal; cursor: pointer;">
<input type="checkbox" name="option[]" value="D"> <?php echo $optionD; ?>
</label><br>
<input type="hidden" name="correct_answer[]" value="<?php echo $correct_answer; ?>">
<!-- CHANGED name to same "option[]", value to null and added class unchecked -->
<!--<input type="hidden" name="option[]" class="unchecked" value="null">-->
<button id='next<?php echo $i;?>' class='next btn btn-default pull-right' type='button' >Next</button>
</div>
</div>
</div>
<?php }elseif($i<$question_rowcount){?>
<div id='question<?php echo $i;?>' class='cont'>
<div class="form-group">
<label style="font-weight: normal; text-align: justify;" class="questions"><b><?php echo "Question" . " " . $counter++; ?></b> <?php echo $questions; ?></label><br>
<div id="quiz-options">
<label style="font-weight: normal; cursor: pointer;">
<input type="checkbox" name="option[]" value="A"> <?php echo $optionA; ?>
</label><br>
<label style="font-weight: normal; cursor: pointer;">
<input type="checkbox" name="option[]" value="B"> <?php echo $optionB; ?>
</label><br>
<label style="font-weight: normal; cursor: pointer;">
<input type="checkbox" name="option[]" value="C"> <?php echo $optionC; ?>
</label><br>
<label style="font-weight: normal; cursor: pointer;">
<input type="checkbox" name="option[]" value="D"> <?php echo $optionD; ?>
</label><br>
<input type="hidden" name="correct_answer[]" value="<?php echo $correct_answer; ?>">
<!-- CHANGED name to same "option[]", value to null and added class unchecked -->
<!--<input type="hidden" name="option[]" class="unchecked" value="null">-->
<br>
<button id='pre<?php echo $i;?>' class='previous btn btn-default' type='button'>Previous</button>
<button id='next<?php echo $i;?>' class='next btn btn-default pull-right' type='button' >Next</button>
</div>
</div>
</div>
<?php }elseif(( $remainder < 1 ) || ( $i == $number_of_question && $remainder == 1 ) ){?>
<div id='question<?php echo $i;?>' class='cont'>
<div class="form-group">
<label style="font-weight: normal; text-align: justify;" class="questions"><b><?php echo "Question" . " " . $counter++; ?></b> <?php echo $questions; ?></label><br>
<div id="quiz-options">
<label style="font-weight: normal; cursor: pointer;">
<input type="checkbox" name="option[]" value="A"> <?php echo $optionA; ?>
</label><br>
<label style="font-weight: normal; cursor: pointer;">
<input type="checkbox" name="option[]" value="B"> <?php echo $optionB; ?>
</label><br>
<label style="font-weight: normal; cursor: pointer;">
<input type="checkbox" name="option[]" value="C"> <?php echo $optionC; ?>
</label><br>
<label style="font-weight: normal; cursor: pointer;">
<input type="checkbox" name="option[]" value="D"> <?php echo $optionD; ?>
</label><br>
<input type="hidden" name="correct_answer[]" value="<?php echo $correct_answer; ?>">
<!-- CHANGED name to same "option[]", value to null and added class unchecked -->
<!--<input type="hidden" name="option[]" class="unchecked" value="null">-->
<br>
<button id='pre<?php echo $i;?>' class='previous btn btn-default' type='button'>Previous</button>
<input class='btn btn-info pull-right' value="Finish & Submit" name="submit" type='submit'>
</div>
</div>
</div>
<?php }
/*$option_array = $_POST['option'];
$unanswered = 0;
if (in_array("null", $_POST['option'])){
$unanswered++;
}
$_SESSION['unanswered'] = $unanswered;
echo $unanswered = $_SESSION['unanswered']; die();*/
$i++;} ?>
</form>
This is my script code for the hiding and displaying
<script>
var total = parseInt(<?php echo $question_rowcount; ?>);
$('.cont').addClass('hide');
count=$('.questions').length;
$('#question'+1).removeClass('hide');
$(document).on('click','.next',function(){
element=$(this).attr('id');
$("input[type='submit']").hide();
last = parseInt(element.substr(element.length - 1));
if (total == last){
$("input[type='submit']").show();
}
nex=last + 1;
$('#question' + last).addClass('hide');
$('#question' + nex).removeClass('hide');
});
$(document).on('click','.previous',function(){
element=$(this).attr('id');
last = parseInt(element.substr(element.length - 1));
pre=last - 1;
$('#question' + last).addClass('hide');
$('#question' + pre).removeClass('hide');
});
</script>
1条答案
按热度按时间kyxcudwk1#
添加以下jquery代码：