Javascript HTML-用于多个下拉列表的数组

在这里，我创建了两行下拉列表，每行分别有“食品/饮料”和“进餐/外卖”。如何创建允许显示多个值的数组

此代码（mainTest.html）在显示多个值时显示两行下拉列表

（函数（）{
/**
*处理“提交”按钮的单击。
*/
SubmitClicked上的函数（事件）{
//从DOM中获取输入元素。
var=document.getElementById（'foodbeverage1'）；
var status=document.getElementById（'status1'）；
//从元素中获取值。
var BEFRAGEVALUE=饮料价值；
var status=status.value；
//构造URL。
var url='newPageTest.html？foodbeverage1='+encodeURIComponent（beverageValue）+'&status1='+encodeURIComponent（status）；
//不要转到URL，而是将其记录到控制台。
location.href=url；
}
//从DOM中获取按钮。
var submitButton=document.getElementById（'btngo'）；
//为单击事件添加事件侦听器。
submitButton.addEventListener（'click'，onSubmitClicked）；
})();

选择您的食物/饮料和数量：
选择食物/饮料：
没有一个
鸡扒
意大利面食
披萨
巧克力蛋糕
红丝绒蛋糕
冰淇淋蛋糕
牛奶
鲜榨果汁
冰淇淋
咖啡
碳酸饮料
水


选择食物/饮料：
没有一个
鸡扒
意大利面食
披萨
巧克力蛋糕
红丝绒蛋糕
冰淇淋蛋糕
牛奶
鲜榨果汁
冰淇淋
咖啡
碳酸饮料
水


进餐或外卖：
没有一个
进餐
带走


进餐或外卖：
没有一个
进餐
带走








你是说类似于
的东西吗



第一选择
第二种选择
第三种选择
通常情况下，数组显示为具有相同名称的多个参数。一些（PHP）用户还使用
[]
或
[]
后缀来命名数组参数

var url = 'newPageTest.html?foodbeverage=' + 
          encodeURIComponent(document.getElementById('foodbeverage1').value) + 
          '&foodbeverage=' + 
          encodeURIComponent(document.getElementById('foodbeverage2').value) + 
          '&status=' + 
          encodeURIComponent(document.getElementById('status1').value) + 
          '&status=' + 
          encodeURIComponent(document.getElementById('status2').value);

如果对表单使用多选，它将自动为您执行此操作。
如果您自己构建查询字符串，那么按类获取元素（html中的
）并循环元素以生成url会更容易


（函数（）{
var url='newPageTest.html？'；
var foodbevs=document.getElementsByClassName（'foodbeverage'）；
对于（var i=0；i0）url+='&'；
url+='foodbeverage='+encodeURIComponent（foodbevs[i].value）
}
var statuses=document.getElementsByClassName（'status'）；
对于（i=0；i

选择您的食物/饮料和数量：
选择食物/饮料：
没有一个
鸡扒
意大利面食
披萨
巧克力蛋糕
红丝绒蛋糕
冰淇淋蛋糕
牛奶
鲜榨果汁
冰淇淋
咖啡
碳酸饮料
水


选择食物/饮料：
没有一个
鸡扒
意大利面食
披萨
巧克力蛋糕
红丝绒蛋糕
冰淇淋蛋糕
牛奶
鲜榨果汁
冰淇淋
咖啡
碳酸饮料
水


进餐或外卖：
没有一个
进餐
带走


进餐或外卖：
没有一个
进餐
带走








谢谢，但我需要的是，当我从下拉列表的第一行和第二行选择值时，所有选择的值都将显示在newPageTest.html中。注意：每行有两个下拉列表。感谢您的澄清。如果我有多行组成下拉列表呢？您可以像我在示例中所做的那样构造url字符串。但是，您最好使用
foodbeverage
类进行
foodbeverage
选择，这样您就可以找到它们并构建url字符串，而不用担心有多少选择和索引号。再次感谢您。你介意展示一个如何做的例子吗？页面无法重定向。我在例子中添加了重定向。我只是向你们展示所有的概念，这样你们就可以理解该做什么，并自己把它组合起来。