php表中的进度条

Question

大家好，我有一个问题，或者更确切地说，是一个我一直在互联网上研究如何放置进度条的问题。它们都使用样式方法，给出其中的百分比。我想添加一个进度条到我的代码在php中，如果有人可以支持我。我会很感激。

正如您在图像中看到的，在我的%总时间中，它已经显示了%。现在，我想用进度条显示该百分比。

我试着展示它，但它只花了我一张唱片。

<br><br>
    <div class="barra">
        <div class="progreso"><div class="porcentaje"></div></div>
    </div>

  <script type="text/javascript">
    document.getElementsByClassName("progreso")[0].style.width = "<?php echo $porcentaje; ?>%";
    document.getElementsByClassName("porcentaje")[0].innerHTML = "<?php echo $porcentaje; ?>%";
</script>

<?php
@ob_flush();
flush();
$total = substr($user->finish, 0, 4)  -substr($user->start, 0, 4) + 1;
$current = substr($user->diasf, 0, 4);
$porcentaje = ($current/$total) * 100;
$porcentaje = round($porcentaje, 0); 
    ?>

 <?php
@ob_flush();
flush();
usleep(500);?>


 <thead>
 
      <th style=""; class="button-3"> Persona Asignada</th>
      <th style=""; class="button-4"> Tarea</th>
      <th style=""; class="button-3">Descripcion</th>
      <th style=""; class="button-3">Dias Asignados</th>
      <th style=""; class="button-3">Dia Finalizado</th>
      <th style=""; class="button-3">% Total tiempo</th>
      
      </thead>
      <?php
      foreach($users as $user){
        ?>
        <tr>
          
      
          <td class="bg-info text-white" style="color:#070001"><?php echo substr($user->persona, 0, 200);; ?></td>
        <td class="bg-info text-white" style="color:#070001"><?php echo substr($user->title, 0, 200);; ?></td>
        <td class="bg-info text-white" style="color:#070001"><?php echo substr($user->description, 0, 200);; ?></td>
        <td class="bg-info text-white" style="color:#070001"><?php echo  substr($user->finish, 0, 200)-substr($user->start, 0, 200) + 1;; ?> Dias</td>
        <td class="bg-info text-white" style="color:#070001"><?php echo substr($user->diasf, 0, 200);; ?> Dias</td>
        <td class="bg-info text-white" style="color:#070001"> 

        <?php 
$total = substr($user->finish, 0, 4)  -substr($user->start, 0, 4) + 1;
$current = substr($user->diasf, 0, 4);
$percent = ($current/$total) * 100;
$percent = round($percent, 0); 

// echo "$current es $percent% of $total.
// <p />";

?>

下面是修复前和修复后的截图

之前没有修复：

在使用@Emrah的解决方案之后：

​

Answer 1

这就是没有javascript的情况。

<?php foreach($users as $user){ ?>

    ...

    <td class="bg-info text-white" style="color:#070001; width:200px;"> 
        <?php 
        $total   = substr($user->finish, 0, 4)  - substr($user->start, 0, 4) + 1;
        $current = substr($user->diasf, 0, 4);
        $percent = ($current/$total) * 100;
        $percent = round($percent, 0); 
        ?>
        <div class="barra" style="background: #EEE; width: 100%; height: 10px; position: relative;">
            <div class="progreso" style="height: 100%; width: <?=$percent?>%; background: green;"><div class="porcentaje"></div></div>
        </div>
    </td>
<?php } ?>

你需要定制的地方；

1. td样式中的宽度值。(width: 200px)
2. barra div样式中的背景色。( background：#EEE；progreso div样式中的height:10px)
3. The背景值。(背景:绿色)