Question

在我的python文件中，我有一个字典 results = {'Key1':'Value1', 'Key2':'Value2'}。我通过了return render_template('pages/queries.html', results=results)

现在使用html了

    <select name="results">
        {% for key, value in results.items() %}
        <option value="{{ key }}">{{ key }}</option>
        {% endfor %}
    </select>
    {% for value in results.values() %}
    <textarea rows="10" cols="40" name="results"> {{value}} </textarea>
    {% endfor %}

很遗憾，由于某种原因，这显示了三个文本区域。我想要的理想结果是有人从下拉列表中选择一个值（选择html），如果他们选择“ key2”，那么我希望“ value2”出现在textarea内。如果他们选择“ key1”，那么我希望动态地将textarea更新为“ value1”。但这没有发生，我尝试更改所有jinja代码和变体的位置，但没有弄清楚，请帮忙。

Answer 1

您需要添加onChange事件处理程序并相应地更新文本区域。

    <select name="results" onchange="changeText(this);">
        {% for key, value in results.items() %}
        <option value="{{ value }}">{{ key }}</option>
        {% endfor %}
    </select>
    <textarea rows="10" cols="40" name="results" id="myTextArea"> {{results.values()[0]}} </textarea>

用于在onChange事件上更新文本区域的JS代码。

function changeText(el) {
    document.getElementById('myTextArea').value = el.value;
}

根据jinja2 / flask中的<select>动态更改<textarea>

1 个答案: