如何从2d数组中创建下拉列表，并在输入中显示值

how to make a drop down list from 2d array and display the value in input?

本文关键字：输入 显示 创建 2d 数组 下拉列表      更新时间：2023-09-26

我想显示一个下拉列表，其条目由编码器填充，列表使用多维数组…并在输入框中显示所选下拉框的值。

下面的一个只适用于1d数组。

Html代码:

<form id="myForm">
<select id="selectCity">
<option>Choose a city</option>
</select>
</form>
<input type="text" name="txtprice" id="txtprice" onClick="checkPrice()">

Javascript代码:

var city = new Array()
city[0][H: 1] = "Delhi";
city[1][H: 2] = "Mumbai";
city[2][H: 3] = "Bangalore";
city[3][H: 4] = "Kolkata";
city[4][H: 5] = "Chennai";
city[5][H: 6] = "Hyderabad";
city[6][H: 7] = "Ahemdabad";
var dropdown = document.getElementById("selectCity");
for (var i = 1; i < city.length; ++i) {
dropdown[dropdown.length] = new Option(city[i], city[i]);
}
var select = document.getElementById('myForm');
var input = document.getElementById('txtprice');
select.onchange = function () {
input.value = select.value;
}

这会稍微改变您的代码以使用数组。它还没有准备好生产，因为它需要添加一个测试来确保用户没有选择第一个选项("choose option")，但就像你的例子一样。

var html="<option>Choose a city</option>", 
city = new Array(),
dropdown = document.getElementById("selectCity"),
select = document.getElementById('myForm'),
input = document.getElementById('txtprice');
city[0] = {name:"Delhi",value: 1,key: "H"};
city[1] = {name:"Mumbai",value: 1,key: "H"};
city[2] = {name:"Bangalore",value: 1,key: "H"};
city[3] = {name:"Kolkata",value: 1,key: "H"};
city[4] = {name:"Chennai",value: 1,key: "H"};
city[5] = {name:"Hyderabad",value: 1,key: "H"};
city[6] = {name:"Ahemdabad",value: 1,key: "H"};
for (var i = 1; i < city.length; ++i) {
    var item=city[i];
    html+="<option value='"+ (item.key+":"+item.value) + "'>"+item.name+"</option>";
}
dropdown.innerHTML=html;
select.onchange = function () {
input.value = dropdown.value;
}
http://jsfiddle.net/dfch52ut/7/

相关文章：