python - 将值传递给进度条(twitter bootstrap，Flask)

我正在使用 twitter bootstrap 来绘制进度条，但我想指定进度量。为此，我使用了一个 Python 字符串 thePercent，它被传递到 html(通过 Flask)。

百分比:

"width: 35%"

目前，我的predictions.html 文件如下所示:

<div class="progress">
  <div class="progress-bar" role="progressbar" aria-valuenow="60" aria-valuemin="0" aria-valuemax="100" style="width: 90%;">
    <span class="sr-only">{{thePercent}}% Complete</span>
  </div>
</div>

我的 view.py 文件如下所示:

@app.route("/result")
def resultpage():

    IDnumber = int(request.args.get('ID'))

    with db:
        cur = db.cursor()
        cur.execute("SELECT AnimalID, AdoptionProbability FROM Demo_Data WHERE AnimalID = '" + str(IDnumber) + "' LIMIT 1")
        query_results = cur.fetchall()

    thePercent= str(int(query_results[0][1]))
    theDog = "static/PetPics/" + str(int(query_results[0][0]))
    print thePercent

    return render_template("predictions.html", thePercent=thePercent, theDog = theDog)

编辑:感谢您到目前为止的答复。我应该提到 thePercent 已成功传递给 predictions.html 文件。例如，

        <div class = "caption-full">

                <a>I have a {{thePercent}} % chance of success</a>
        </div>

返回正确的输出

编辑:我应该提到以下代码有效:

<div class="progress">
  <div id = 'progressBar' class="progress-bar" role="progressbar" aria-valuenow="30" aria-valuemin="0" aria-valuemax="100" style="width: 30%;">

    <script src="//code.jquery.com/jquery-1.11.0.min.js"></script>
    <script> $("#progressBar").css("width",'90%'); </script>

    <span class="sr-only">{{thePercent}} Complete</span>
  </div>
</div>

但是，如果我尝试用 {{thePercent}} 替换 '90%'，则会出现错误。

我认为问题是我已经有效地将 JQuery 与 Jinja 混合在一起。但是如何仅使用 Jinja 更改进度条呢？

最佳答案

您不是在打印 thePercent 的值，而是将 style 属性设置为等于 'thePercent' 值。您需要使用 Jinja 的 {{}} 来输出其值，就像您在编辑中所做的那样。

    <div class="progress-bar progress-bar-success" style="width:{{ thePercent }}%">

编辑:

我更新了 style 属性。因为 thePercent 只包含属性的百分比而不是完整值，所以其余的值(例如 width 和 % )需要在模板中处理。

关于python - 将值传递给进度条(twitter bootstrap，Flask)，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/25225517/