Php Jquery中的进度条工作不正常
完全是网络开发新手。每次用户通过进度条选择一个选项时,我都试图在考试表格中向用户显示进度,这样用户就可以知道还有多少问题或占整个考试的百分比。问题是进度条工作不正常。当我选择第一个选项时,进度条已达到100% 如何解决此问题 这是我的密码Php Jquery中的进度条工作不正常,php,jquery,html,css,Php,Jquery,Html,Css,完全是网络开发新手。每次用户通过进度条选择一个选项时,我都试图在考试表格中向用户显示进度,这样用户就可以知道还有多少问题或占整个考试的百分比。问题是进度条工作不正常。当我选择第一个选项时,进度条已达到100% 如何解决此问题 这是我的密码 </head> <body> <?Php require "config0.php"; $count=$dbo->prepare("select * from questions where question_id=1 "
</head>
<body>
<?Php
require "config0.php";
$count=$dbo->prepare("select * from questions where question_id=1 ");
if($count->execute()){
$row = $count->fetch(PDO::FETCH_OBJ);
}
$questions_number = $dbo->query("select count(question_number) from questions
left join servey_question on questions.question_id = servey_question.question_id where servey_id = 'serv01' ")->fetchColumn();
echo "
<div id='maindiv' class='maindiv'>
<form id='f1'>
<table>
<tr><th>
<input type='hidden' id=question_id value=$row->question_id>
</th></tr>
<tr><th>
<h4 id='q1'>$row->question</h4>
</th></tr>
<tr><td>
<input type='radio' name='options' id='opt1' value='1' > <label for='opt1' class='lb'>$row->opt1</label>
</td></tr>
<tr><td>
<input type='radio' name='options' id='opt2' value='2' > <label for='opt2' class='lb'>$row->opt2</label>
</td></tr>
<tr><td>
<input type='radio' name='options' id='opt3' value='3' > <label for='opt3' class='lb'>$row->opt3</label>
</td></tr>
<tr><td>
<input type='radio' name='options' id='opt4' value='4' > <label for='opt4' class='lb'>$row->opt4</label>
</td></tr>
<tr><td>
<input type='radio' name='options' id='opt5' value='5' > <label for='opt5' class='lb'>$row->opt5</label>
</td></tr>
<tr><td>
<input type='radio' name='options' id='opt6' value='6' > <label for='opt6' class='lb'>$row->opt6</label>
</td></tr>
</table>
</form>
</div>
<div id='progress'>
<span class='progress-text'></span>
<div class='progress-bar'></div>
</div>
";
?>
<script>
$(document).ready(function() {
$("input:radio[name=options]").click(function() {
//for progress bar
var total = 53;
for(var i=1;i<=total;i++){
var percent = (i/total*100);
$('#progress .progress-text').text(percent + '%');
$('#progress .progress-bar').css({'width':percent+'%'});
}
$('#maindiv').hide('slide', {direction: 'left'}, 2000);
$.post( "examck.php", {"option_no":$(this).val(),"question_id":$("#question_id").val()},function(return_data,status){
if(return_data.next=='T'){
$("#question_id").val(return_data.data.question_id);
$('#q1').html(return_data.data.q1);
$('label[for=opt1]').html(return_data.data.opt1);
$('label[for=opt2]').html(return_data.data.opt2);
$('label[for=opt3]').html(return_data.data.opt3);
$('label[for=opt4]').html(return_data.data.opt4);
$('label [for = opt5]').html(return_data.data.opt5);
$('label [for = opt6]').html(return_data.data.opt6);
}
else{$('#maindiv').html("Thank you ");
$.ajax({ url: 'score.php' });
var link = $("<a href ='registrationForm.php'>...Close</a>");
$('#maindiv').append(link);
}
},"json");
$("#f1").delay(1000);
$("#f1")[0].reset();
$('#maindiv').show('slide', {direction: 'right'}, 1000);
});
});
</script>
</body>
</html>
我相信你的问题是“For”循环每次执行时都会100%地产生结果
仔细看看你的逻辑。您设置了“总计=53”。for循环将一直执行,直到“i”小于或等于53。因此,最后一次迭代将是53/53*100,这将始终导致100%
您需要做的是传入一个值(参数)来表示回答了多少问题,并使用该值来确定剩下的百分比
只是一个基于您所写内容的示例:
$("input:radio[name=options]").click(function(numAnswered) {
//for progress bar
var total = 53; //represents total number of questions
for(var i=1;i<=numAnswered;i++){
var percent = (i/total*100);
$('#progress .progress-text').text(percent + '%');
$('#progress .progress-bar').css({'width':percent+'%'});
}
}
$(“输入:收音机[name=options]”)。单击(函数(numAnswered){
//用于进度条
var total=53;//表示问题总数
对于(var i=1;i