Question

在使用Twitter Bootstrap中的进度条时，我想设置一个更改变量发送到样式宽度参数：

<div class="progress progress-striped">
  <div class="bar" style="width: 20%;"></div>
</div>

我希望能够在从数据库文件中获取百分比数后更改宽度。

例如，如果从数据库中检索到的数字是80，那么我会将80合并到样式的百分比部分中：

style =“width：80％;”

我已经尝试在HTML中使用Javascript中的变量，但我没有走得太远。

感谢您的帮助，

托米

Answer 1

将百分比放在var中并在javascript或jQuery中使用它。我将使用jQuery：

$(document).ready(function() {
    var theWidth = // Wherever you get the var;
    $(".progress-striped > .bar").width(theWidth + "%");
});

要详细说明“你的var”部分，我们需要知道如何获取数据库信息。

Answer 2

希望这个答案有所帮助，我想解释执行所需任务的JavaScript和jQuery方法。

jQuery方法：

$(document).ready(function() {
    var progWidth = /* The way you'd access the database file to obtain the percent. */
    $('.progress-striped > .bar').width(progWidth + "%");
});

纯JavaScript方法：

document.onload = function() {
    var progWidth = /* The way you'd access the datbase file to obtain the percent. */
    $('.progress-striped > .bar').width(progWidth + "%");
}

Twitter Bootstrap Style =“width：45％;”

2 个答案: