0
264
VistasjQuery addClass a un elemento secundario que no funciona en Egde
tengo esta estructura:
<ul> <li class="js-drilldown-back"><a>Back</a></li> <li><a href="#">item</a></li> <li><a href="#">item</a></li> <li><a href="#">item</a></li> </ul>y estoy tratando de agregar una clase a la primera etiqueta, por lo que se convierte en esto:
<ul> <li class="js-drilldown-back"><a class="click-back">Back<a></li> <li><a href="#">item</a></li> <li><a href="#">item</a></li> <li><a href="#">item</a></li> </ul>El marco que uso es agregar este botón Atrás de forma dinámica, por lo que no puedo agregarle la clase manualmente. He probado este código:
$(".js-drilldown-back").children("a").addClass("click-back")pero no parece funcionar en Edge, otros navegadores parecen estar contentos con él. También he intentado:
$(".js-drilldown-back:has a").addClass("click-back") $(".js-drilldown-back:has > a").addClass("click-back") $(".js-drilldown-back a").addClass("click-back") $(".js-drilldown-back > a").addClass("click-back")Lo que estoy tratando de lograr es que cuando hace clic en el botón Atrás, se elimina una clase de la etiqueta del cuerpo, es decir:
$(".click-back").click(function(){ $("#page").removeClass("submenu-open") })Apuntar al padre (.js-drilldown-back) no parece funcionar, por eso estoy tratando de agregar la clase al niño y apuntar a esto en su lugar.
1 Respuestas
Responde la pregunta0
Parece que no tiene terminaciones de punto y coma adecuadas después de cada declaración.
$(".js-drilldown-back").children("a").addClass("click-back");:first-child parece funcionar bien en Edge, ¿o tal vez el archivo console.log en jsfiddle está siendo indulgente? También modifiqué la forma en que está aplicando su evento de clic y confirmé que elimina la clase del ancla.
$(".js-drilldown-back:first-child").addClass("click-back"); console.log( $(".js-drilldown-back:first-child").hasClass("click-back") ); $(document).on("click", ".click-back", function(){ $(this).removeClass("click-back"); })La consola confirma que el ancla tiene la clase deseada, es decir, :first-child está funcionando.
Al hacer clic en el ancla, la fuente confirma que se eliminó la clase. Cambié el objetivo solo para confirmar que estaba eliminando algo que podía ver y verificar.
Todo probado en Edge aquí: https://jsfiddle.net/8bfo9cza/