如何根据下拉选择来选择数组的第一列

How do I select the first column of the array based on the drop down selection?

本文关键字:选择 一列 数组 何根      更新时间:2023-09-26

好吧,我认为把我搞砸的线路是23号

        tag.innerHTML = maps[this.value][1];

但我一直在"SCRIPT5007:无法获取属性"1"的值:对象为null或未定义"在IE JS控制台中。它不显示任何

我也试过

        tag.innerHTML = maps[0][1];

但所做的只是选择数组中的第一行,然后显示数组中的第二列,而不管选择如何。

我希望它选择用户选择的行的第二列。有什么帮助吗?这是完整的代码。

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Untitled Document</title>
<script>
window.onload=function(){
    var maps = new Array();
        maps[0] = ["Text A1", "Text A2", "Text A3"];
        maps[1] = ["Text B1", "Text B2", "Text B3"];
        maps[2] = ["Text C1", "Text C2", "Text C3"];
        maps[3] = ["Text D1", "Text D2", "Text D3"];
        maps[4] = ["Text E1", "Text E2", "Text E3"];
        maps[5] = ["Text F1", "Text F2", "Text F3"];
    var map = document.getElementById("complaintType");
    for (i = 0; i < maps.length; i++) {
        var Entry = document.createElement("option");
        Entry.text = maps[i][0];
        map.add(Entry, null);
    }
    var tag = document.getElementById('tag');
    map.onchange = function () {
        tag.innerHTML = maps[0][0];
    }
}
</script>
</head>
<body>
<form>
    <select name="complaintType" id="complaintType">
    <option>Select One</option>
    </select>
</form>
<div id="tag"></div>
<a href="#" >Link</a> | <a href="#">Link</a>
</body>
</html>

尝试更改为:

map.onchange = function () {
    var tag = document.getElementById('tag');
    if(map.selectedIndex != 0)
    {
        tag.innerHTML = maps[map.selectedIndex - 1][1];
    }
    else
    {
        tag.innerHTML = "";
    }
}

如果您在循环中将每个条目的value设置为i,您将得到我相信您正在寻找的东西:

var maps = [
  ["Text A1", "Text A2", "Text A3"],
  ["Text B1", "Text B2", "Text B3"],
  ["Text C1", "Text C2", "Text C3"],
  ["Text D1", "Text D2", "Text D3"],
  ["Text E1", "Text E2", "Text E3"],
  ["Text F1", "Text F2", "Text F3"]
];
var map = document.getElementById("complaintType");
for (i = 0; i < maps.length; i++) {
  var Entry = document.createElement("option");
  Entry.text = maps[i][0];
  Entry.value = i;
  map.add(Entry, null);
}
var tag = document.getElementById('tag');
map.onchange = function() {
  tag.innerHTML = maps[this.value][1];
}
<form>
  <select name="complaintType" id="complaintType">
    <option>Select One</option>
  </select>
</form>
<div id="tag"></div>
<a href="#">Link</a> | <a href="#">Link</a>