我的標題可能有點令人困惑......這是我第一次嘗試（有史以來）一個 web 應用程式，我得到了以下一組復選框的解決方案，這些復選框是在 FastAPI 和 Jinja2 的 html 模板中創建的。
{% for name in names %}
<input type="checkbox" id='{"box": "a", "name_id": "{{name.id}}"}' onchange=submit_me(this)>
<input type="checkbox" id='{"box": "b", "name_id": "{{name.id}}"}' onchange=submit_me(this)>
{% endfor %}
<script>
function submit_me(box){
data = JSON.parse(box.id)
data["checked"] = box.checked
fetch("/test", {
method: "PUT",
headers: {
"Content-Type": "application/json"
},
body: JSON.stringify(data)
})
}
</script>
這只是一個更復雜代碼的簡單示例，但顯示了我的（沒有經驗的）解決方案，以在我的函式中獲取框（“a”或“b”）以及名稱（通過 jinja 的名稱迭代）。我只是想知道，這是否真的是一個有效的選擇，或者是否有一種更“標準”的方法來解決這個問題？
順便說一下，這只是“快速而骯臟”的解決方案，因為我無法直接通過 jinja 和 FastAPI 呼叫 python 函式（html -> python 后端 -> 資料庫）
uj5u.com熱心網友回復：
這不是元素的id用途。如果您需要將隨機資料附加到元素，請使用data-屬性。input元素具有應該用于描述值的name屬性和屬性，以及實際值。value無需在其中填充 JSON id（它應該是檔案中元素的唯一識別符號）。
通過選中復選框來提交資料似乎也是錯誤的（通常，取決于您的用例） -form如果您有要提交的資料，請使用元素，并在單擊按鈕時提交。
由于您有硬編碼值（a，b），因此使用迭代似乎也有點奇怪：
<input type="checkbox" name="box_a" id="box-a" value="{{ names[0].id }}" onchange="submit_me(this);">
<input type="checkbox" name="box_b" id="box-b" value="{{ names[1].id }}" onchange="submit_me(this);">
但是，如果您有a/b存盤在您的name物件中，請使用迭代并有一個元素，您可以根據需要在標簽中填寫資訊：
<input type="checkbox" name="box_{{ name.key }}" id="box-{{ name.key }}" value="{{ name.id }}" onchange="submit_me(this);">
轉載請註明出處，本文鏈接：https://www.uj5u.com/shujuku/442475.html
標籤：javascript html 休息 网络应用 快速API