0

我想用依赖于另一个下拉列表的值填充下拉列表，也就是说，当我在第一个控件中选择一个项目时，第二个控件应该加载相应的“子项目”。

这是我的 JS 代码（在 HTML 头中）：

<script type="text/javascript">

var tipos = new Array("Tipo1", "Tipo2", "Tipo3");
var subtipos_aux = new Array();
subtipos_aux[0]="Esto no deberia aparecer";
subtipos_aux[1]="Subtipos para TIPO1|Subtipos para TIPO1";
subtipos_aux[2]="Subtipos para TIPO2|Subtipos para TIPO2";
subtipos_aux[3]="Subtipos para TIPO3|Subtipos para TIPO3|Subtipos para TIPO3";

function cargarTipos() {
    var lista = document.getElementById('__tipo');
    var x, i = 0;
    for(x in tipos){
        lista.options[i++] = new Option(tipos[x],tipos[x]);
    }
}

function cargarSubtipos(id_tipo) {
    var lista = document.getElementById('__subtipo');
    var x, i = 0; id_tipo++;
    var subtipos = subtipos_aux[id_tipo].split("|");
    for(x in subtipos) {
        lista.options[i++] = new Option(subtipos[x],subtipos[x]);
    }
}

这就是我在 HTML 正文中调用函数的方式：

<fieldset>
  ...
  <select id="__tipo" name="__tipo" onchange="cargarSubtipos(this.selectedIndex);">
  ...
  <select id="__subtipo" name="__subtipo">
  ...
</fieldset>

<script language="javascript">cargarTipos("__tipo");</script>

主列表完美加载，当我从中选择一个选项时，会调用读取子类型的函数。但是，二级列表没有显示任何内容！我到处都放了警报，并注意到：

  1. 读取 selectedIndex 的值：OK
  2. 从 subtipos_aux 中获取适当的元素：OK
  3. subtipos_aux 到 subtipos（数组）的转换是可以的（我在 for 循环中放了一个警报）

就是这样，有人可以告诉我我在这里做错了什么吗？

谢谢！

4

1 回答 1

0

加载时您没有填充选择，因此您需要将其放在 cargarTipos 的末尾：

cargarSubtipos(0);

有一个例子

于 2013-06-12T18:04:43.870 回答