Tengo un script jquery que al principio oculta todas las opciones de selección:
$('option[data-start="1"]').hide();y luego muestra opciones basadas en la selección del usuario de otra entrada.
$('option[data-variable1="' + variable1x + '"][data-variable2="' + variable2x + '"]').show();Todo funciona muy bien, pero en Safari .hide() no funciona. Sé sobre la solución:
$('option[data-start="1"]').prop('disabled', true); $('option[data-variable1="' + variable1x + '"][data-variable2="' + variable2x + '"]').prop('disabled', false);Pero esto solo desactiva algunas opciones. Tengo docenas de opciones, por lo que hay una larga lista de opciones inactivas. Intenté ocultar opciones inactivas, pero Safari probablemente ignora este código:
select option[disabled="disabled"]{display:none !important;width:0;height:0;visibility: hidden;opacity:0;} select option:disabled { display:none !important;height:0;width:0;visibility: hidden;opacity:0;}¿Podría ayudarme con alguna solución para Safari?
para obtener un navegador completo compatible para ocultar y mostrar elementos, intente usar el atributo hidden https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/hidden
para usarlo en su código para ocultar la option
$('option[data-start="1"]').attr('hidden','hidden'); y para mostrar una option use
$('option[data-start="1"]').removeAttr('hidden','hidden');aquí un violín de trabajo https://jsfiddle.net/zj2kLxc8/1/