<html>
<head>
<script language="JavaScript">
function addOpt(oCntrl, iPos, sTxt, sVal){
var selOpcion=new Option(sTxt, sVal);
eval(oCntrl.options[iPos]=selOpcion);
}
function cambia(oCntrl,origen){
for(x=oCntrl.length;x>-1;x--){oCntrl.options[x]=null;}
switch (origen.selectedIndex){
case 1:
addOpt(oCntrl, 0, "Ciudad de México", "http://www.mexico.com");
addOpt(oCntrl, 1, "Monterrey", "http://www.monterrey.com");
addOpt(oCntrl, 2, "Guadalajara", "http://www.guadalajara.com");
break;
case 2:
addOpt(oCntrl, 0, "Madrid", "http://www.madrid.com");
addOpt(oCntrl, 1, "Barcelona", "http://www.barcelona.com");
addOpt(oCntrl, 2, "San Sebastián", "http://www.sansebastian.com");
addOpt(oCntrl, 3, "veracruz", "veracruz");
break;
case 3:
addOpt(oCntrl, 0, "Caracas", "http://www.caracas.com");
break;
}
}
</script>
</head>
<body>
<form name="frm">
<table border="0" width="482">
<tr>
<td width="25">
Pais
</td>
<td width="89">
<select name="pais" onchange="cambia(document.forms['frm']['ciudad'],document.forms['frm']['pais'])">
<option value=""></option>
<option value="Mex">Mexico</option>
<option value="Esp">España</option>
<option value="Ven">Venezuela</option>
</select>
</td>
<td width="6">
</td>
<td width="44">
Ciudad
</td>
<td width="296">
<select name="ciudad" >
</select> </td>
</tr>
<tr>
<td>Pais</td>
<td><select name="pais[]" onchange="cambia(document.forms['frm']['ciudad[]'],document.forms['frm']['pais[]'])">
<option value=""></option>
<option value="Mex">Mexico</option>
<option value="Esp">España</option>
<option value="Ven">Venezuela</option>
</select></td>
<td> </td>
<td>Ciudad</td>
<td><select name="ciudad[]" >
</select></td>
</tr>
<tr>
<td>Pais</td>
<td><select name="select" id="select" onchange="cambia(document.frm.select2,document.frm .select)">
<option value=""></option>
<option value="Mex">Mexico</option>
<option value="Esp">España</option>
<option value="Ven">Venezuela</option>
</select></td>
<td> </td>
<td>Ciudad</td>
<td><select name="select2" id="select2" >
</select></td>
</tr>
</table>
</form>
</body>
</html>