在使用JavaScript、HTML和CSS构建迷你应用程序时。我得到了'；未定义'；所选下拉列表的值

我试图构建一个界面，在这里我可以打印用户输入到表中的值，然后它会不断更新。基本功能工作正常，但当我在表中输入时，下拉列表中的值（测试类型和产品类型）显示为“未定义”。 谁能帮我解决这个问题

var行=1
var entry=document.getElementById（“条目”）；
entry.addEventListener（“单击”，显示详细信息）；
函数displayDetails（）{
var name=document.getElementById（“name”）.value；
var email=document.getElementById（“email”）.value；
var TestType=document.getElementsByName（“TP”）.value；
var ProductType=document.getElementById（“产品类型”）.value；
var IP=document.getElementById（“txta_地址”）.value；
var Inputs=document.getElementById（“num_Inputs”）.value；
如果（名称=“”| |电子邮件=“”| |测试类型=“”| |产品类型=“”| | IP=“”| |输入=“”）{
警告（“请填写所有字段！”）；
返回；
}
var display=document.getElementById（“display”）；
var newRow=display.insertRow（行）；
var cell1=newRow.insertCell（0）；
var cell2=newRow.insertCell（1）；
var cell3=newRow.insertCell（2）；
var cell4=newRow.insertCell（3）；
var cell5=newRow.insertCell（4）；
var cell6=newRow.insertCell（5）；
cell1.innerHTML=名称；
cell2.innerHTML=电子邮件；
cell3.innerHTML=TestType；
cell4.innerHTML=ProductType；
cell5.innerHTML=IP；
cell6.innerHTML=输入；
}

*{
保证金：1；
填充：1；
}
html{
背景：径向梯度（rgba（179255255,0.5），rgba（255255,0.5））
}
#名字{
边缘顶部：50px；
}
.输入{
字体大小：25px；
颜色：#004d00；
字体风格：首字母；
字体系列：“泰晤士报新罗马”，泰晤士报，衬线；
保证金：5px；
}
#入口{
宽度：150px；
高度：60px；
字体大小：25px；
字体系列：“泰晤士报新罗马”，泰晤士报，衬线；
背景色：#05193d；
颜色：白烟；
盒影：02px2p0rgba（0,0,0,0.5）；
边缘顶部：10px；
}
桌子{
边界塌陷：塌陷；
边界：#05193d；
宽度：70%；
保证金：50px自动；
背景颜色：白肋木；
}
表，th，td{
边框：5px纯黑；
填充：30px；
}
th{
字体大小：30px；
字体系列：“泰晤士报新罗马”，泰晤士报，衬线；
字号：700；
颜色：#004d00；
}
运输署{
字体大小：30px；
字体系列：“泰晤士报新罗马”，泰晤士报，衬线；
颜色：深红色；
字号：700；
字体大小：30px；
字体系列：“泰晤士报新罗马”，泰晤士报，衬线；
}

Web应用程序
用户输入表格
首先输入您的详细信息
输入您的姓名：




输入您的电子邮件：




测试类型：
-选择-
制造业
频道
深静脉血栓




产品类型：
-选择-
突袭
马蹄铁
乌木
iSCSI




IP地址：




输入的CHAIS数量：




提交信息
名称
电子邮件
测试类型
产品类型
IP地址
Chasis输入

有两个不同的错误

第一个

var TestType=document.getElementsByName（“TP”）.value和第二个副本
id

getElementsByName
返回一个集合，因此您必须像
var TestType=document.getElementsByName（“TP”）[0]一样使用它

其次，两个
div
和
select
具有相同的
id
。因此，代码正在考虑
div
并给出
未定义的值


var行=1
var entry=document.getElementById（“条目”）；
entry.addEventListener（“单击”，显示详细信息）；
函数displayDetails（）{
var name=document.getElementById（“name”）.value；
var email=document.getElementById（“email”）.value；
var TestType=document.getElementsByName（“TP”）[0]。值；
var ProductType=document.getElementById（“产品类型选择”）.value；
var IP=document.getElementById（“txta_地址”）.value；
var Inputs=document.getElementById（“num_Inputs”）.value；
如果（名称=“”| |电子邮件=“”| |测试类型=“”| |产品类型=“”| | IP=“”| |输入=“”）{
警告（“请填写所有字段！”）；
返回；
}
var display=document.getElementById（“display”）；
var newRow=display.insertRow（行）；
var cell1=newRow.insertCell（0）；
var cell2=newRow.insertCell（1）；
var cell3=newRow.insertCell（2）；
var cell4=newRow.insertCell（3）；
var cell5=newRow.insertCell（4）；
var cell6=newRow.insertCell（5）；
cell1.innerHTML=名称；
cell2.innerHTML=电子邮件；
cell3.innerHTML=TestType；
cell4.innerHTML=ProductType；
cell5.innerHTML=IP；
cell6.innerHTML=输入；
}
*{
保证金：1；
填充：1；
}
html{
背景：径向梯度（rgba（179255 255，0.5），rgba（255 255，0.5））
}
#名字{
边缘顶部：50px；
}
.输入{
字体大小：25px；
颜色：#004d00；
字体风格：首字母；
字体系列：“泰晤士报新罗马”，泰晤士报，衬线；
保证金：5px；
}
#入口{
宽度：150px；
高度：60px；
字体大小：25px；
字体系列：“泰晤士报新罗马”，泰晤士报，衬线；
背景色：#05193d；
颜色：白烟；
盒影：02px2p0rgba（0,0,0,0.5）；
边缘顶部：10px；
}
桌子{
边界塌陷：塌陷；
边界：#05193d；
宽度：70%；
保证金：50px自动；
背景颜色：白肋木；
}
桌子
th，
运输署{
边框：5px纯黑；
填充：30px；
}
th{
字体大小：30px；
字体系列：“泰晤士报新罗马”，泰晤士报，衬线；
字号：700；
颜色：#004d00；
}
运输署{
字体大小：30px；
字体系列：“泰晤士报新罗马”，泰晤士报，衬线；
颜色：深红色；
字号：700；
字体大小：30px；
字体系列：时间