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>

显然，点击标签会选择收音机。我还需要做的是根据单选按钮的选择状态更改标签的类。所以，添加一个类＆＃34;活跃＆＃34;选择的收音机标签，如果未选择收音机，则将其删除。

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

Answer 1

通过监视change事件并根据checked状态切换类

，jQuery非常简单

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

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

toggleClass允许第二个参数的布尔值来确定是添加还是删除。 this.checked将是真或假;

如果您需要在页面加载时运行它，只需在页面加载时触发change：

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

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

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

1 个答案: