tratando de ocultar las opciones de la lista de selección .. no funciona en Chrome y es decir,

Question

Tengo una lista de selección, que tiene muchas opciones. Dependiendo de alguna entrada, deseo ocultar algunas opciones de la lista de selección. jQuery para ocultar las opciones de lista de selección que he escrito como

$('#selectlist1 option').each(function(){ 

    $(this).hide(); 

}) 

Pero este código parece funcionar sólo para Firefox y no su trabajo en el cromo y el IE. Mientras que si escribo

$('#selectlist1').hide(); 

funciona para todos los navegadores. Cualquier puntero a donde debería mirar?

Answer 1

No puede ocultar elementos de opciones individuales x-browser. La única solución es reemplazar el elemento seleccionado con un elemento nuevo con solo las opciones que desea visualizar.

Ver este otro question

Answer 2

Para que nadie tenga que hacer frente a ocultar elementos de opción en esas versiones afectadas, he publicado aquí una solución que no clonar o eliminar las opciones, pero vanos envuelve alrededor de ellos, lo que podría decirse que es mucho más fáciles de tratar:

http://work.arounds.org/issue/96/option-elements-do-not-hide-in-IE/

Answer 3

Aquí está una manera relativamente concisa para reconstruir la lista de selección en la demanda con nuevas opciones. Esto funciona para las opciones insertados de forma dinámica (que es lo que IE y Chrome tienen un problema con mostrar y ocultar)

$().ready(function() { 
    //store a reference 
    var select = $('#myselect'); 
}); 

function rebuild_select(arr_new_options) { 
    var parent = select.parent(); 
    select.empty(); 
    var clone = select.clone(); 
    select.remove(); 
    for(var x=0; x < arr_new_options.length; x++) { 
     clone.append(arr_new_options[x]); 
    } 
    parent.append(clone); 
    select = clone; 
}