引导进度条问题答案

【问题标题】：Bootstrap progress bar issue引导进度条问题
【发布时间】：2016-07-30 14:44:53
【问题描述】：

我只是在学习进度条和 PHP 数据库。截至目前，我的进度条并没有增加它的价值。如果我手动将其设置为“2”，它将起作用。如果我将它设置在 2 以上的任何位置，它将无法工作。这是使用 Bootstrap 完成的。

这是我第一次访问这样的网站，如果我想说的没有意义，请见谅。

<?php
    $items =  $database->query("SELECT User_Items FROM Items WHERE Username = User_Here");
    if($items->num_rows)
    {
        while($row = $items->fetch_assoc())
        {
            $itemcount = $row['User_Items']; 
        }
    }
?>

<div class="row">
    <div class="col-lg-2 col-md-4 col-sm-6">
        <p>Total Items</p>
        <div class="progress">
            <div class="progress-bar progress-bar-info" role="progressbar" aria-valuenow="<?php echo $totalitems; ?>" aria-valuemin="0" aria-valuemax="5" style="width: 0%"></div>
        </div>

       <div class="progress">
            <div class="progress-bar progress-bar-info" role="progressbar" aria-valuenow="2" aria-valuemin="0" aria-valuemax="5" style="width: 0%"></div>
        </div>

        <div class="progress">
            <div class="progress-bar progress-bar-info" role="progressbar" aria-valuenow="5" aria-valuemin="0" aria-valuemax="5" style="width: 0%"></div>
        </div>
    </div>
</div>
<script type="application/javascript">
$('.progress-bar').each(function() {
  var min = $(this).attr('aria-valuemin');
  var max = $(this).attr('aria-valuemax');
  var now = $(this).attr('aria-valuenow');
  var siz = (now-min)*100/(max-min);
  $(this).css('width', siz+'%');
});
</script>
<?php
    mysqli_free_result($result);
    $database->close();
?>

此图像的进度条设置为“2”

此图像的进度条设置为最大值“5”。

【问题讨论】：

让您调试 $itemcount。它有什么价值吗？
是的。它给出了一个价值。
您能否澄清一下，您是说底部进度条（值硬编码为 5）不起作用？或者它只是第一个变量值不起作用的变量。
硬编码的并没有像预期的那样“填满”。它保持为空。变量也是如此。

标签： php jquery html css twitter-bootstrap

【解决方案1】：

认为问题是我从未有过

<script type="text/javascript" src="http://code.jquery.com/jquery-latest.min.js"></script>

包括在内。
在我将它放入我的脚本后它开始工作（以为我已经有了它）。
感谢那些提供帮助的人！

【讨论】：

【解决方案2】：

在您的 siz 变量中使用 parseInt()，如下所示：

替换：

$(this).css('width', siz+'%');

与：

$(this).css('width', parseInt(siz)+'%');

它将“siz”变量值视为string，因此您需要将string更改为interger。

【讨论】：

【解决方案3】：

$itemcount、$itemcount 的问题似乎是空的。

请参阅：JsFiddle 它正在工作。

【讨论】：

$itemcount 正在打印一个值，比如说 50。条形图未填充到最大值“5”。它一直是空的。