Javascript 所选单选按钮的摘要

我对在HTML表单上生成所选单选按钮和复选框的摘要感兴趣。我已经知道了如何为文本字段生成输入摘要，而不是单选按钮或复选框。（很抱歉，这是非常基本的，我对JavaScript非常陌生。）我尝试以类似于我为文本字段生成订单摘要的方式接近单选按钮，但没有成功

函数calcOrder（）{
var firstName=document.getElementById（“firstName”）.value；
var lastName=document.getElementById（“lastName”）.value；
var userName=firstName+“”+lastName；
var phone=document.getElementById（“phone”）.value；
var email=document.getElementById（“email”）.value；
document.getElementById（“orderConfirm”）.innerHTML=“订单摘要：”；
document.getElementById（“orderConfirm”）.innerHTML+=“”+用户名+”
“+电话+”
“+电子邮件+”
”；
}

名字：
姓氏：
电话：
电邮：
命令
煎饼还是碗<玉米煎饼

碗

大米
白色

棕色

无

黑豆
黑豆

平托

无

蛋白质
牛排

猪肉

鸡肉

豆腐中饭

无

配料
蔬菜法吉塔

生菜

奶酪

酸奶油

玉米

西红柿

莎莎酱

鳄梨酱

附加说明


下单

检查此项是否要检查表单输入检查和单选按钮的所有选择值

const form=document.querySelector（'form'）
让我们总结一下；
form.addEventListener（'change'，function（））{
summary=Object.values（form.reduce）（（obj，field）=>{obj[field.name]=field.value；返回obj}，{}）
console.log（摘要）
});

名字：
姓氏：
电话：
电邮：
命令
煎饼还是碗<玉米煎饼

碗

大米
白色

棕色

无

黑豆
黑豆

平托

无

蛋白质
牛排

猪肉

鸡肉

豆腐中饭

无

配料
蔬菜法吉塔

生菜

奶酪

酸奶油

玉米

西红柿

莎莎酱

鳄梨酱

附加说明


下单


您可以使用

   document.querySelectorAll("input[type=radio]:checked");
   document.querySelectorAll("input[type=checkbox]:checked");
   

以获取所有选中的复选框和单选按钮

下面是一个更新的代码片段


const confirmtn=document.getElementById（“确认”）；
确认添加的监听器（“点击”，calcOrder）；
函数calcOrder（）{
var firstName=document.getElementById（“firstName”）.value；
var lastName=document.getElementById（“lastName”）.value；
var userName=firstName+“”+lastName；
var phone=document.getElementById（“phone”）.value；
var email=document.getElementById（“email”）.value；
const selectedRadio=document.querySelectorAll（“输入[type=radio]：选中”）；
const selectedcheckbox=document.querySelectorAll（“输入[type=checkbox]：选中”）；
const result=document.getElementById（“订单确认”）
让radioResult=“”；
让checkboxResult=“”；
让顺序=`
订单摘要：
${userName}
${phone}

${email}


`;
for（设i=0；i${selectedRadio[i].value}`；
}
订单+=“
”；
for（设i=0；i${selectedCheckboxes[i].value}`；
}
订单+=“
”；
result.innerHTML=订单；
}

名字：
姓氏：
电话：
电邮：
命令
煎饼还是碗<玉米煎饼

碗

大米
白色

棕色

无

黑豆
黑豆

平托

无

蛋白质
牛排

猪肉

鸡肉

豆腐中饭

无

配料
蔬菜法吉塔

生菜

奶酪

酸奶油

玉米

西红柿

莎莎酱

鳄梨酱

附加说明




下单