Jinja2 - 在我的jinja模板中使用javascript變量

Question

我想在我的網頁中選擇一個元素（HTML選擇元素）做一個動態過濾器。

我的第一個列表已經設置好了，我想在第一次選擇時更改第二個列表（HTML select元素）的內容。

但要做到這一點，我需要的Jinja2使用的document.getElementByid（JavaScript）的結果作爲這樣一個動態的變量：

document.getElementById('select02').innerHTML = 
"{% for i in context.get(document.getElementById('select02').value) %} 
<option {{'selected' if package == 1 else ''}} value='{{i}}'>{{i}}</option> 
{% endfor %}"; 

生成頁面，我使用的是Jinja2的模板python腳本。

有人已經使用過此功能嗎？

Answer 1

假設context是一個字典，你必須把所有的東西放入你的頁面，可能通過JSON。然後，您需要編寫javascript函數以1）獲取用戶爲第一個列表選擇的內容（列表表示html選擇元素）2）使用1）中的值更新第二個列表。使用JavaScript事件最好是2）在第一個列表的每個用戶交互（更改，單擊）時觸發。

請記住，您不能將服務器端代碼（jinja2模板）與客戶端代碼（javascript）混合在一起！