如何使用 Flask 和 HTML 从 python 列表创建下拉菜单

Posted

技术标签:

【中文标题】如何使用 Flask 和 HTML 从 python 列表创建下拉菜单【英文标题】:How to create dropdown menu from python list using Flask and HTML 【发布时间】:2018-02-03 05:58:36 【问题描述】:

我正在尝试使用 python 脚本中的信息在 html 中创建一个下拉菜单。到目前为止,我已经让它工作了,但是,html 下拉列表将列表中的所有 4 个值显示为 4 个选项。

当前:选项1:红、蓝、黑橙; 选项 2: 红色、蓝色、黑色、橙色等(链接中的屏幕截图) Current

期望:选项 1: 红色 选项 2: 蓝色 等等

如何使python列表分开?

dropdown.py

from flask import Flask, render_template, request
app = Flask(__name__)
app.debug = True


@app.route('/', methods=['GET'])
def dropdown():
    colours = ['Red', 'Blue', 'Black', 'Orange']
    return render_template('test.html', colours=colours)

if __name__ == "__main__":
    app.run()

test.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Dropdown</title>
</head>
<body>
<select name= colours method="GET" action="/">
    % for colour in colours %
    <option value= "colour" SELECTED>colours</option>"
    % endfor %
</select>

</body>
</html>

【问题讨论】:

【参考方案1】:

您需要在两个地方都使用colour(而不是第二个位置的colours):

<select name="colour" method="GET" action="/">
    % for colour in colours %
        <option value="colour" SELECTED>colour</option>"
    % endfor %
</select>

注意在循环中使用selected会为所有选项添加selected属性,最后一个会被选中,你需要做的如下:

<select name="colour" method="GET" action="/">
  <option value="colours[0]" selected>colours[0]</option>
  % for colour in colours[1:] %
    <option value="colour">colour</option>
  % endfor %
</select>

【讨论】:

【参考方案2】:

您有错字,请将colours 替换为colour

<option value= "colour" SELECTED>colours</option>"

替换为

<option value= "colour" SELECTED> colour </option>"
                                     <!--  ^^^^ -->

【讨论】:

以上是关于如何使用 Flask 和 HTML 从 python 列表创建下拉菜单的主要内容,如果未能解决你的问题,请参考以下文章

如何在Python框架Flask中将图像文件从表单上传到数据库

ubantu中搭建virtualenv+python3.4+flask

你如何将消息从 Flask 服务器(Python)发送到 HTML 客户端?

Python如何将RGB图像转换为Pytho灰度图像?

Flask 应用最佳实践

从 HTML 表单发布值并在 Flask 视图中访问它们