Requiero ayuda para colocar una lista dependiente para seleccionar una imagen, tengo el siguiente script.
<img src="URL DE LA IMAGEN" width="128" height="96" border="0" name="Imagen">
<script>
var _img = new Array();
_img[0] = new Image(); _img[0].src="URL DE LA IMAGEN";
_img[1] = new Image(); _img[1].src="URL DE LA IMAGEN";
_img[2] = new Image(); _img[2].src="URL DE LA IMAGEN";
_img[3] = new Image(); _img[3].src="URL DE LA IMAGEN";
function cambiarA(_obj)
{
if(!_obj)return;
var _index = _obj.selectedIndex;
if(!_index)return;
var _item = _obj[_index].value;
if(!_item)return;
if(_item<0 || _item >=_img.length)return;
document.images["Imagen"].src=_img[_item].src;
}
</script>
<form method="get">
<select onchange="cambiarA(this)">
<option value="">Seleccionar Imagen</option>
<option value="0">Imagen 1</option>
<option value="1">Imagen 2</option>
<option value="2">Imagen 3</option>
<option value="3">Imagen 4</option>
</select>
</form>
Pero no logro que esta lista dependa de otra, si alguno de ustedes puede ayudarme se lo agradezco.
Requiero unirla con una lista dependiente parecida a esta
<SCRIPT LANGUAGE="JavaScript">
var arrItems1 = new Array();
var arrItemsGrp1 = new Array();
arrItems1[3] = "Camión";
arrItemsGrp1[3] = 1;
arrItems1[4] = "Tren";
arrItemsGrp1[4] = 1;
arrItems1[5] = "Coche";
arrItemsGrp1[5] = 1;
arrItems1[6] = "Barco";
arrItemsGrp1[6] = 2;
arrItems1[7] = "Submarino";
arrItemsGrp1[7] = 2;
arrItems1[0] = "Aviones";
arrItemsGrp1[0] = 3;
arrItems1[1] = "Ultraligero";
arrItemsGrp1[1] = 3;
arrItems1[2] = "Ala delta";
arrItemsGrp1[2] = 3;
var arrItems2 = new Array();
var arrItemsGrp2 = new Array();
arrItems2[21] = "747";
arrItemsGrp2[21] = 0
arrItems2[22] = "Cessna";
arrItemsGrp2[22] = 0
arrItems2[31] = "Kolb Flyer";
arrItemsGrp2[31] = 1
arrItems2[34] = "Kitfox";
arrItemsGrp2[34] = 1
arrItems2[35] = "Schwietzer Glider";
arrItemsGrp2[35] = 2
arrItems2[99] = "Chevy Malibu";
arrItemsGrp2[99] = 5
arrItems2[100] = "Lincoln LS";
arrItemsGrp2[100] = 5
arrItems2[57] = "BMW Z3";
arrItemsGrp2[57] = 5
arrItems2[101] = "F-150";
arrItemsGrp2[101] = 3
arrItems2[102] = "Tahoe";
arrItemsGrp2[102] = 3
arrItems2[103] = "Tren de carga";
arrItemsGrp2[103] = 4
arrItems2[104] = "Tren de pasajeros";
arrItemsGrp2[104] = 4
arrItems2[105] = "Contenedor de aceite";
arrItemsGrp2[105] = 6
arrItems2[106] = "Barco de pesca";
arrItemsGrp2[106] = 6
arrItems2[200] = "Los Angelas Class";
arrItemsGrp2[200] = 7
arrItems2[201] = "Kilo Class";
arrItemsGrp2[201] = 7
arrItems2[203] = "Seawolf Class";
arrItemsGrp2[203] = 7
function selectChange(control, controlToPopulate, ItemArray, GroupArray)
{
var myEle ;
var x ;
for (var q=controlToPopulate.options.length;q>=0;q--) controlToPopulate.options[q]=null;
if (control.name == "firstChoice") {
for (var q=myChoices.thirdChoice.options.length;q>=0;q--) myChoices.thirdChoice.options[q] = null;
}
myEle = document.createElement("option") ;
myEle.value = 0 ;
myEle.text = "[Selecciona]" ;
controlToPopulate.add(myEle) ;
for ( x = 0 ; x < ItemArray.length ; x++ )
{
if ( GroupArray[x] == control.value )
{
myEle = document.createElement("option") ;
myEle.value = x ;
myEle.text = ItemArray[x] ;
controlToPopulate.add(myEle) ;
}
}
}
</script>
<form name=myChoices>
<table align="center">
<tr>
<td>
<SELECT id=firstChoice name=firstChoice onchange="selectChange(this, myChoices.secondChoice, arrItems1, arrItemsGrp1);">
<option value=0 SELECTED>[Selecciona]</option>
<option value=1>Tierra</option>
<option value=2>Mar</option>
<option value=3>Aire</option>
</SELECT>
</TD><TD>
<SELECT id=secondChoice name=secondChoice onchange="selectChange(this, myChoices.thirdChoice, arrItems2, arrItemsGrp2);">
</SELECT>
<SELECT id=thirdChoice name=thirdChoice>
</SELECT>
</TD>
</TR>
</TABLE>
</form>
Si pueden ayudarme a unir ambas
