我的网站向用户展示他们的测验结果。结果是从SQL数据库返回的。我已经确认数据被正确返回,并且是正确的类型(整数)。文本字段按预期添加,但是对于百分比栏(用户的分数),只有第一个正确加载。
我在php文件中的代码:
$(document).ready(function() {
$width = $("#myResultBar").data('width');
$("#myResultBar").css("width", $width + "%");
});
</script>
我和〈?php的代码,只正确显示第一个百分比栏:
<?php
for($i = 0; $i < count($life_ins_quiz_chapter_num); $i++){
?>
<!-- results box -->
<div class="result_box">
<h3 class="hd text-center">Chapter: <?php echo $life_ins_quiz_chapter_num[$i];?></h3>
<p><?php echo $life_ins_quiz_chapter_desc[$i];?></p>
<div class="row align-items-center">
<div class="bar_main col-sm-11 col-9">
<div id="mySaving" class="bar">
<div id="mySavingBar" data-width="<?php echo $life_ins_quiz_chapter_pct[$i];?>"></div><!--problem here-->
</div>
</div>
<div class="percent col-sm-1 col-3">
** <!--This only shows up the first time. What am I doing wrong?-->**
<?php echo $life_ins_quiz_chapter_pct[$i]; ?> %
</div>
</div>
<div class="box_analysis">
<h3>Question Score: <?php echo "[ " . $life_ins_quiz_chapter_score[$i] . "/6 ]"; ?> </h3>
<?php //echo $saving_report_detail; ?>
</div>
</div>
<?php
}//end for
?>
我有:1-做了多次检查,以获得正确的数据类型到该变量gettype(variable)= integer 2-无法弄清楚是否有一种方法来改变js中的东西,让它增加id(例如#MySavingBar_1(2,3)等。
乐于接受任何指导或建议。
2条答案
按热度按时间z0qdvdin1#
相应调整代码
当你在PHP中循环时,你有多个
result_box
。所以在javascript中,你需要在result_box
中循环,并设置ht程序width
。JS解释
qco9c6ql2#
@Chandra Shekhar的建议帮助我解决了这个问题。
在本例中,我使用jQuery each()函数来迭代生成的每个div。我必须从使用id=“myResultBar”切换到使用class=“myResultBar”。这是iterating over divs...的答案所建议的。解决此问题的代码:
});