document
.getElementById('add-a-dog-to-a-member-form')
.addEventListener('submit',async function (event){
event.preventDefault();
let filter={};
const inputs=document.querySelectorAll('input[type=text],input[type=radio]:checked');
for (const input of inputs){
filter[input.name]=input.value;
}
console.log(filter['id']);
console.log(filter['name']);
console.log(filter['gender']);
event.target.reset();
});
<form id="add-a-dog-to-a-member-form">
<p>Add a dog to a member.</p>
id of the member: <input type="text" name="id" ><br><br>
name of the dog: <input type="text" name="name"><br><br>
gender of the dog:
<br>
<input type="radio" id="male" name="gender" value="m">
<label for="male">Male</label><br>
<input type="radio" id="female" name="gender" value="f">
<label for="female">Female</label><br><br>
<input type="submit" value="add the dog">
</form>
我想将三个值,即 id、name 和狗的性别信息传递到 javascript 代码,以便我可以使用 fetch API 执行 POST 请求。我想测试是否所有这些值都已传递到 javascript 代码中,因此在将它们用于 fetch API 之前,我将它们一一打印在控制台上。现在的问题是,这段代码只在控制台打印出姓名和性别,没有id。所以似乎id没有成功地从表单传递到javascript。我不知道哪里出错了。请帮帮我。非常感谢!