Business
Jobs
  • About Us
  • Solutions
    • Job Postings
      Post your job and receive qualified candidates in 48h.
    • Candidate Assessments
      500+ technical and psychological tests, plus anti-fraud.
    • Headhunting
      Tailor-made executive search from start to finish.
    • Payroll + EOR
      Payroll dispersal and EOR across 15+ LATAM countries.
  • Pricing
  • Jobs

0

186
Views
No se pueden ocultar/mostrar las opciones <select> en Safari, pero funciona bien en Firefox y Chrome

Tengo un menú desplegable principal y un menú desplegable secundario en mi página. Cuando cambio la opción en el menú desplegable principal, algunas de las opciones que se muestran en el menú desplegable secundario deben ocultarse y solo deben mostrarse las opciones apropiadas. El código que tengo funciona como deseo en Chrome y Firefox, pero no en el navegador Safari.

Al depurar desde Safari Console, encuentro que la clase hidden se elimina de la <option></option> adecuada, pero las opciones en el menú desplegable secundario no se ocultan. Del mismo modo, cuando selecciono la opción 'Todos' en el menú desplegable principal, se hidden todas las opciones del menú desplegable secundario; y cuando selecciono cualquier otra opción, las opciones en el menú desplegable secundario que antes no estaban hidden (aparecían), que ahora deben ocultarse, ahora tienen la clase hidden agregada. Pero esto no se muestra/muestra en la interfaz de usuario.

Esto es de la consola de Safari. Como se muestra aquí... la clase hidden se ha agregado a la opción, pero la opción aún está visible y se puede seleccionar en la interfaz de usuario.

Se ha agregado una clase oculta a la opción, pero la opción aún está visible y se puede seleccionar en la interfaz de usuario.

He visto otros problemas similares publicados en StackOverflow y en otros blogs, donde se sugiere desactivar la opción, en lugar de ocultarla. Mi problema es que, dado que este es un problema específico del navegador, y dado que funciona en todos los demás navegadores, excepto Safari, me gustaría evitar cambiar la funcionalidad.

Esto es lo que tengo hasta ahora =>

formulario.jsp

 ... ... <select class="form-control" onchange="toggleDropdowns(this.value)"> <option value="">All</option> <c:forEach items="${items.rows}" var="set"> <option value=".${set.id}">${set.nm}</option> </c:forEach> </select> .... ....

Función JS

 toggleDropdowns : function(id) { $(".inactive .set-option").addClass("hidden"); $(".inactive .set-option" + id).removeClass("hidden"); }

Actualizar

También probé otras formas de ocultar/mostrar la opción, como usar .css({display:none}); . Esto también funciona en Firefox y Chrome, pero no en Safari.

about 4 years ago · Juan Pablo Isaza
Answer question
Find remote jobs

Discover the new way to find a job!

Top jobs
Top job categories
Business
Post vacancy Pricing Sales
Legal
Terms and conditions Privacy policy
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Show me some job opportunities
There's an error!