我正在嘗試使用燒瓶和 AJAX 迭代表單以獲取喜歡的表單。如果只有一個表單并且我使用按 id 獲取元素，它就可以作業。在迭代類時我在 JS 中做錯了什么？
HTML：
<form class="like_form" method="POST">
<input type="hidden" name="user_id" value="{{session['logged_in']['id']}}">
<input type="hidden" name="like_id" value="32">
<input type="submit" value="??">
</form>
<form method="POST">
<input type="hidden" name="user_id" value="{{session['logged_in']['id']}}">
<input type="hidden" name="like_id" value="32">
<input type="submit" value="??">
</form>
var like_form = document.getElementsByClassName('like_form');
for(var i = 0; i < like_form.length; i ){
like_form[i].onsubmit = function(e){
e.preventDefault();
console.log("clicked form")
var form = new FormData(like_form)
fetch("http://localhost:5000/test/form", { method :'POST', body : form})
.then( response => response.json() )
.then( data => {
console.log(data)
console.log(data['stars'])
const stars = document.getElementById("stars")
stars.innerHTML = `?? ${data['stars']}`
})
}
}
uj5u.com熱心網友回復：
您需要獲取一個表單的表單資料，而不是表單的集合。為了使它作業，我建議使用一個for..of回圈let來獲得塊范圍：
for (let lform of like_form) {
lform.onsubmit = function(e) {
e.preventDefault();
console.log("clicked form");
var form = new FormData(lform); // <---
第二個問題是document.getElementById("stars")。該元素在您的 HTML 中不存在。此外，如果這應該是與表單相關的元素（每個表單一個），請注意id屬性在 HTML 中應該是唯一的，因此您應該以不同的方式選擇此類元素。
uj5u.com熱心網友回復：
最終不得不使用索引進行迭代:(也非常好地更改了頁面上的類似內容！只需使用索引來提交和更改頁面上的數字。請參閱 like_count[i].value
let like_form = document.getElementsByClassName('like_form');
let like_count = document.getElementsByClassName('like_count');
for(let i = 0; i < like_form.length; i ){
like_form[i].onsubmit = function(e){
e.preventDefault();
console.log("clicked form")
var form = new FormData(like_form[i])
fetch("http://localhost:5000/test/form", { method :'POST', body : form})
.then( response => response.json() )
.then( data => {
if (data['stars']){
console.log(data)
console.log(data['stars'])
const stars = document.getElementById("stars")
stars.innerHTML = `?? ${data['stars']}`
like_count[i].value = `?? ${data['num']}`
}
})
}
}
轉載請註明出處，本文鏈接：https://www.uj5u.com/yidong/450398.html
標籤：javascript 循环 通过类名获取元素
上一篇：為什么我有換行符？
下一篇：為什么我不能在這里命令時中斷？