Twitter Bootstrap Style = "宽度：45%;"答案

【问题标题】：Twitter Bootstrap Style = "width: 45%;"Twitter Bootstrap Style = "宽度：45%;"
【发布时间】：2015-04-14 17:12:00
【问题描述】：

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

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

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

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

style="宽度：80%;"

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

感谢您的帮助，

汤米

【问题讨论】：

标签： javascript html css twitter-bootstrap

【解决方案1】：

希望这个答案有所帮助，我喜欢解释执行您想要的任务的 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 + "%");
}

【讨论】：

我不认为第二个解决方案是纯 javascript，因为 $('.progress-striped > .bar') 是一个 jquery 方法

【解决方案2】：

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

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

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

【讨论】：

Ftr，这样theWidth 将被解释为px 而不是百分比。
@nietonfir 谢谢。已编辑。