hola amigos tengo este problema
<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){
switch (document.frm.pais.selectedIndex){
case 1:
addOpt(oCntrl, 0, "Abrecartas", "1");
addOpt(oCntrl, 1, "Broche", "2");
addOpt(oCntrl, 2, "Desengrapador", "3");
addOpt(oCntrl, 3, "Engrapadora", "4");
addOpt(oCntrl, 4, "Boligrafo fino azul", "5");
addOpt(oCntrl, 5, "Boligrafo fino rojo", "6");
addOpt(oCntrl, 6, "Boligrafo fino negro", "7");
addOpt(oCntrl, 7, "Toner tinta negra 5158 hp laser jet", "8");
break;
case 2:
addOpt(oCntrl, 0, "Extintor", "10");
break;
case 3:
addOpt(oCntrl, 0, "Limpia vidrios", "11");
addOpt(oCntrl, 1, "Contenedor para basura", "12");
addOpt(oCntrl, 2, "Plumeros", "13");
break;
}
}
</script>
</head>
<body>
<form name="frm">
<table border="0" width="482">
<tr>
<td width="25">
Pais
</td>
<td width="89">
<select name="pais[]" id="pais" onchange="cambia(document.frm.ciudad)">
<option value=""></option>
<option value="2">Artículos de Oficina</option>
<option value="3">Artículos de Seguridad</option>
<option value="4">Artículos de Limpieza</option>
</select>
</td>
<td width="6">
</td>
<td width="44">
Ciudad
</td>
<td width="296">
<select name="ciudad[]" id="ciudad" >
<option value=""></option>
</select> <input type="button" value="Ir a..." onClick="location.href=this.form.ciudad.options[this.form.ciudad.selectedIndex].value"></td>
</tr>
</table>
</form>
</body>
</html>
cuando selecciono una opcion del primer select se agrega sus opciones correspondientes pero el problema es que si antes habia seleccionado otro esos otras opciones seguen estando ahi que puedo hacer para que se limpie todo el segudo select y solo aparescan los que deben ir
saludos amigos
espero sus comentarios