Question

我无法在单选按钮列表的标签中添加类，下面是html代码：

<div class="custom-radio">
 <input id="MainContent_rblUserType_2" type="radio" checked="checked" value="3" name="MainContent$rblUserType">
 <label class="" for="MainContent_rblUserType_2">I am buyer</label>
</div>

我试图在标签中添加类的Jquery是：

$(document).ready(function() {
if($("input.check").is(":checked")){
        $(this).label.addClass("checked");
}
});

Answer 1

使用.next()

$("input:radio").next('label').addClass("checked");

此外，您的输入没有名称为check的任何类，因此您可能希望将其更改为

$("input:radio").is(":checked")

您也可以这样做，而不是if条件 -

$(document).ready(function() {
    $("input:radio:checked").next('label').addClass("checked");
});

演示---> http://jsfiddle.net/tLFjA/5/

Answer 2

在您的情况下，$(this)是文档，而不是输入。尝试而不是：

$(document).ready(function() {
if($("input.check").is(":checked")){
    $(this).label.addClass("checked");
}
});

这个：

$(document).ready(function() {
    $("input.check:checked").next('label').addClass('checked')
});

此外，您可能需要绑定更改事件。

$('input.check').change(function(){
    var $this = $(this);
    $this.is(:checked) ? $this.next('label').addClass('active') : $this.next('label').removeClass('active') 
})

还有CSS3的可能性：

input.check:checked ~ label{ your styles}

~可以是+，具体取决于您的DOM。

Answer 3

<div class="custom-radio">
   <input id="MainContent_rblUserType_2" class="check" type="radio" checked="checked" value="3" name="MainContent$rblUserType">
   <label class="checkLabel" for="MainContent_rblUserType_2">I am buyer</label>
</div>


$(document).on("click", 'input.check', function () {
  if ($(this).is(":checked")) {
    $('label.checked').removeClass('checked');
    $(this).next("label.checkLabel").addClass("checked");
  }
});

您需要添加类以输入和标签，如上所示它将事件绑定到无线电输入，当检查时，添加类并在未检查无线电输入时删除类 Demo Jsfiddle，http://jsfiddle.net/prem_nagalla1/h7BZa/

如果选中单选按钮，则jQuery addClass标记

3 个答案: