¿Ocultar opciones en el elemento seleccionado, no funciona en IE? [duplicado] - jquery, internet-explorer, seleccione

Posible duplicado:
Ocultar la opción de selección en IE usando jQuery

Así que como puedes ver a continuación, tengo dos seleccionarelementos. El primero tiene dos valores, 1.4 y 1.7. Dependiendo de la opción seleccionada, quiero desactivar ciertas opciones en el segundo elemento de selección. Funciona perfectamente bien en Chrome, pero IE está siendo una perra (¡como de costumbre!).

¿Alguna idea de lo que está mal?

<p>
<label style="width: 155px; display: inline-block;">Height</label>
<select name="height">
<option value="1.4">1.4</option>
<option value="1.7">1.7</option>
</select>
</p>
<p>
<label style="width: 155px; display: inline-block;">Amount</label>
<select name="slanor">
<option class="four" value="2">2</option>
<option class="four seven" value="3">3</option>
<option class="seven" value="4">4</option>
</select>
</p>


<script>
$(document).ready(function() {
check();

$("select[name=height]").change(function() {
check();
});

function check() {
var slanor = $("select[name=slanor]");
var currHeight = $("select[name=height]").val();

if(currHeight == "1.4") {
slanor.find("option").hide();
slanor.find(".four").show();
} else {
slanor.find("option").hide();
slanor.find(".seven").show();
}
}
});
</script>

Respuestas

La noción de lo oculto. options en un select no existe en IE. Tendría que eliminar manualmente y volver a agregar las entradas, lo que puede ser un inconveniente.

Otra solución sería deshabilitar también los elementos:

slanor.find(option).hide().prop("disabled", true);

Esto ocultará la opción en todos los navegadores que la admiten, pero la deshabilitará en IE, lo que significa que aún estará visible, pero se distinguirá visualmente de las otras opciones y no se podrá seleccionar.

sin embargo: si su problema es exactamente como lo ha descrito, y solo hay dos opciones en las que su script variará, la solución más simple podría ser hide y show dos menús desplegables diferentes por completo, dependiendo de la opción seleccionada.

Llamar a .hide () en jQuery agrega display: none al elemento. Dudo que sea HTML estándar que pueda ocultar opciones de esta manera.

Podrías usar este código en su lugar:

slanor.empty();
if (currHeight == "1.4") {
slanor.append($("<option">).val("2").text("2"));
slanor.append($("<option">).val("3").text("3"));
}
else {
slanor.append($("<option">).val("3").text("3"));
slanor.append($("<option">).val("4").text("4"));
}

La etiqueta de opción no admite la visualización cssatributo. Que es lo que hace show () / hide (). Su mejor opción es eliminar y recrear las opciones a medida que sean necesarias. O supongo que podría agregarlos a otro objeto oculto y retirarlos cuando los necesite completamente formados.

Entonces tendrías algo como

$("option").appendTo($("#myhiddenselect"));
$(".four").appendTo($("#myvisibleselect"));