JQuery: cambio de estilo del elemento cuando se hace clic en la casilla de verificación

Tengo elementos html (usando MVC3 Razor)

       <h2 class="price">
              @Html.LabelFor(vm => vm.Price)
              @Html.Encode(@Model.Price)
       </h2>
        <div id="checkbox-price">
              @Html.CheckBoxFor(vm => vm.IncludeToPayment) Include in payment.
        </div>

¿Cómo puedo cambiar el estilo del elemento h2?

Gracias de antemano.

preguntado el 04 de julio de 12 a las 02:07

2 Respuestas

$('#checkbox-price input:checkbox').change(function(){
  if (!$(this).is(':checked')) {
     $('.price').css('text-decoration', 'line-through')
  } else {
     $('.price').css('text-decoration', 'none')
  }
})

o

  $('#checkbox-price input:checkbox').change(function() { 
            // or $(`input[type="checkbox"]')
            var $obj = $('.price');
            if (!$(this).is(':checked')) {
              $obj.css('text-decoration', 'line-through'); //or addClass                
            } else {
              $obj.css('text-decoration', 'none'); // or addClass                
            }
        })

Respondido 04 Jul 12, 03:07

¿Qué tal si tengo muchas casillas de verificación? ¿Esto también se activa si marqué las otras casillas de verificación? lo siento, soy un principiante en JQuery - lincx

@csharplinc en ese caso, el código debe modificarse, depende de la estructura del marcado. - indefinido

@undefined ++1 por la rapidez :P, Puede hacer una pequeña mejora. - Tats_innit

Aquí hay un código simple y demo en vivo.

Esto se aplica a todas las casillas de verificación.

$('input[type="checkbox"]').click(function() {
    if (this.checked) {
        //alert('Checked');
        $("h2").addClass('newclass');
    } else {
        //alert('Unchecked');
        $("h2").removeClass('newclass');
    }
});​

Si desea solicitar una casilla de verificación específica, use a continuación

$('input[type="checkbox"]') to $('input.someclass)

Respondido 04 Jul 12, 02:07

No es la respuesta que estás buscando? Examinar otras preguntas etiquetadas or haz tu propia pregunta.