Radiobutton添加类时检查，删除时不检查

Question

你可以帮我。我想将类'checked'添加到类'.group_4'的跨度中。我想我会使用jQuery。我无法更改HTML。

现在发生的情况是：单击这两个项目时，该类不会被删除。所以这两个跨度都有“gechecked”类。

任何简单的解决方案？

谢谢。

$(document).ready(function() { 
 
    $(".attribute_list label").click(function() { 
 
    if ($('input.attribute_radio').is(':checked')) { 
 
     $(this).find('.group_4').addClass("gechecked"); 
 
    } else { 
 
     $(this).find('.group_4').removeClass("gechecked"); 
 
    } 
 
    }); 
 
});

<div class="attribute_list"> 
 
    <ul> 
 
    <li> 
 
     <label><div class="radio" style="display: none;"><span class="checked"><input style="display:none !important" type="radio" class="attribute_radio" name="group_4" value="25"></span></div> 
 
\t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t <span class="group_4 gechecked">Graniet</span></label> 
 
    </li> 
 
    <li> 
 
     <label><div class="radio" style="display: none;"><span class=""><input style="display:none !important" type="radio" class="attribute_radio" name="group_4" value="26" checked="checked"></span></div> 
 
\t \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t <span class="group_4 gechecked">Composiet</span></label> 
 
    </li> 
 
    </ul> 
 
</div>

Answer 1

这里是fiddle

jQuery(document).ready(function($) { 
    $(".attribute_list label").click(function() { 
    $('.group_4').removeClass("gechecked"); 
    if ($('input.attribute_radio').is(':checked')) { 
     $(this).find('.group_4').addClass("gechecked"); 
    } 
    }); 
}); 

Answer 2

试试这个代码：

$(document).ready(function() { 
     $(".attribute_list label").click(function() { 
     $(this).find('.group_4').removeClass("gechecked");   
     $('input.attribute_radio:checked').parent().parent().parent().find('.group_4').addClass("gechecked"); 
     }); 
    }); 

Answer 3

jQuery(document).ready(function($) { 
    $(".attribute_list label").click(function() { 
    $('.group_4').removeClass("gechecked"); 
    if ($('input.attribute_radio').is(':checked')) { 
     $(this).find('.group_4').addClass("gechecked"); 
    } 
    }); 
});