jquery - 选择时将类别添加到 radio 的标签中，而未选择时将其删除？

Question

我的 HTML 标签内有单选按钮。我需要在选择 radio 时向此标签添加一个类，并在未选择 radio 时删除该类。

下面的代码会在选择 radio 时添加该类，但在未选择该 radio 时不会将其删除。

http://jsfiddle.net/UJM6G/

<div class="form-input radios"> <div class="form-radios form-element-type-radios"><div class="form-form-element-wrapper"><div class="form-item form-item-radio">
<div class="form-input radio"> <label class="option" for="edit-vehicle-owner-1"><input type="radio" name="vehicle_owner" value="1" class="form-radio form-element-type-radios"> Yes</label>
</div><div class="form-error"></div></div>
</div><div class="form-form-element-wrapper"><div class="form-item form-item-radio">
<div class="form-input radio"> <label class="option" for="edit-vehicle-owner-0"><input type="radio" value="0" class="form-radio form-element-type-radios"> No</label>
</div><div class="form-error"></div></div>
</div></div>
</div>

  $('.form-element-type-radios').click(function(){
    if ( $('input.form-radio').is(':checked') ) {
      $(this).parent('label').addClass('checked');
    }
    else {
      $(this).parent('label').removeClass('checked');
    }
  });

Answer 1

您应该使用.change()事件

$('input.form-radio').change(function () {
    if ($(this).prop('checked')) {
        $('input.form-radio').parent('label').removeClass('checked')
        $(this).parent('label').addClass('checked');
    }
}).change();

DEMO