Javascript 如何将下拉菜单项打印为文本框中的列表

我正试图得到一个下拉菜单，其中有几个选项，我可以打印出总价格，但我想添加一些其他东西，如选择的选项，这是写在这里的一部分名称。例如，如果我的选项的值是20，我想像这里->20那样打印它，但无法实现

以下是我的代码：

函数calculatePrice（）{
//获取所选数据
var elt=document.getElementById（“foodItem”）；
var food=elt.options[elt.selectedIndex].value；
elt=document.getElementById（“drinkItem”）；
var=elt.options[elt.selectedIndex].value；
elt=document.getElementById（“沙漠项目”）；
var desert=elt.options[elt.selectedIndex].value；
elt=document.getElementById（“tipItem”）；
var tip=elt.options[elt.selectedIndex].value；
//将数据转换为整数
食物=parseInt（食物）；
饮料=parseInt（饮料）；
沙漠=parseInt（沙漠）；
tip=parseInt（tip）；
//计算总价值
总风险=食物+饮料+沙漠+小费；
//将值打印到PicExtPrice
document.getElementById（“totalPrice”）.value=total；
}







选择你的食物
安蒂奇牛排
烤宽面条
意大利面
选择你的饮料
焦炭
喷洒
啤酒
选择你的沙漠
巴克拉瓦
苏特拉ç
表面
你想给小费吗？
不用了，谢谢。
10TL
15TL
20TL


您必须支付的金额：

您的代码非常简洁，您现有的函数

calculatePrice

可以使用额外的代码片段创建一个账单摘要，正如您所解释的那样。您当前正在使用变量

elt

按Id获取所有元素，该Id可以保持唯一，以便以后可以使用它们获取下拉列表的文本值，并创建摘要。最后，您可以使用它的id将这个摘要添加到一个空标记（比如div）中

函数calculatePrice（）{
//获取所选数据
var foodElt=document.getElementById（“foodItem”）；
var food=foodElt.options[foodElt.selectedIndex].value；
var drinkElt=document.getElementById（“drinkItem”）；
var drink=drinklet.options[drinklet.selectedIndex].value；
沙漠地带=document.getElementById（“沙漠项目”）；
var desert=desertElt.options[desertElt.selectedIndex].value；
tipElt=document.getElementById（“tipItem”）；
var tip=tipElt.options[tipElt.selectedIndex].value；
//将数据转换为整数
食物=parseInt（食物）；
饮料=parseInt（饮料）；
沙漠=parseInt（沙漠）；
tip=parseInt（tip）；
//计算总价值
总风险=食物+饮料+沙漠+小费；
//将值打印到PicExtPrice
document.getElementById（“totalPrice”）.value=total；
var汇总=“”；
如果（食物>0）{
summary+=foodElt.options[foodElt.selectedIndex].text+'：'+food+'\n'；
}
如果（饮酒量>0）{
summary+=drinklet.options[drinklet.selectedIndex]。text+'：'+drink+'\n'；
}
如果（沙漠>0）{
summary+=desertElt.options[desertElt.selectedIndex].text+'：'+desert+'\n'；
}
如果（提示>0）{
摘要+='Tip'+'：'+Tip+'\n'；
}
document.getElementById（“摘要”）.innerHTML=摘要；
} 

以下是对HTML的补充：

---

注意：您可以简单地使用相同的变量

elt

，但必须内联管理摘要计算；）

试试这个@CodingWithRoyal这和我分享的代码是一样的，你能再检查一下吗？谢谢你的帮助。我真的理解逻辑。但还是不知道如何打印摘要。我使用您必须支付的金额：

用于价格部分，但当我尝试将其用于汇总时，我无法获得输出。您只需要汇总，而不需要总价？只需将上面发送的html部分替换为：这是一个代码笔