Me gustaría, al cargar la página, verificar si una casilla de verificación está marcada. Luego, si lo está, agregue una clase a la etiqueta. Actualmente tengo el siguiente script pero no funciona.
$(document).ready(function() { $('input').is(':checked') { $(this).parent('label').toggleClass('label--active'); }); });Mi HTML es:
<label class="container-checkbox" for="checkOne"> <span class="checkbox-label">Option one</span> <input type="checkbox" id="checkOne"> <span class="checkmark"></span> </label>No puedo cambiar el orden de DOM ya que estas son casillas de verificación personalizadas.
Supongo que puedes usar esto:
$(document).ready(function() { let checkboxone = document.getElementById('checkOne'); checkboxone.addEventListener('change',function() { checkboxone.parentNode.classList.toggle('label--active'); }); });¿Cómo funciona?
Cada vez que se haga clic en la casilla de verificación, se agregará/eliminará la clase 'etiqueta activa'.