使用jquery设置基于选择状态的表单标签样式？

Question

我有单选按钮形式，如在

<label for="challenge" class="fat">Challenge 
    <input type="radio" name="create-what" value="challenge" id="challenge"> 
</label> 
<label for="team" class="fat">Team 
    <input type="radio" name="create-what" value="team" id="team"> 
</label> 

显然，点击标签选择无线电。我还需要做的是根据单选按钮的选定状态更改标签的类别。所以，给所选收音机的标签添加一个“活动”类，如果收音机未被选中，则将其删除。

我有很多这样的对，所以我一直在寻找最便携的方式。谢谢。

Answer 1

在jQuery是通过基于checked状态

$('input:radio').change(function(){ 

    $(this).parent().toggleClass('active', this.checked).siblings().removeClass('active'); 
}); 

toggleClass监测change事件和切换类相当简单允许第二个参数的布尔，以确定是否添加或移除。 this.checked将是真或假;

如果您需要此网页加载和运行只是触发change当页面加载：

$('input:radio').change(function(){ 

    $(this).parent().toggleClass('active', this.checked).siblings().removeClass('active'); 
}).change();