1

私はhtml要素を持っています(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>

ユーザーがJQUeryを使用してチェックボックスをオフ/チェックしたときに、h2要素のスタイルを変更するにはどうすればよいですか(この場合、テキスト装飾:内部のアイテムをラインスルーします)?

前もって感謝します。

4

2 に答える 2

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

また

  $('#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                
            }
        })
于 2012-07-04T01:48:35.043 に答える
2

これが簡単なコードとライブデモです。

これはすべてのチェックボックスに適用されます

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

特定のチェックボックスを申請する場合は、以下を使用してください

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

</ p>

于 2012-07-04T01:58:37.140 に答える