选中单选按钮时如何选择div

Question

我有类（两者）的div，我想在选中ID（免费）的单选按钮时选择并应用样式。 CSS选择器将如何显示？

Answer 1

您可以使用jQuery来实现此目的：

$('#free').change(function() {
    //if checkbox checked
    if(this.checked){
        $('.both').addClass('newstyle');
    }
    //if the checkbox is not checked or unchecked
    if(!this.checked){
        $('.both').removeClass('newstyle');
    }
});

这是一个简单的小提示：https://jsfiddle.net/p3wc4ex6/1/

如果您正在寻找纯CSS G-Cyr's answer很棒

Answer 2

CSS选择器看起来像：

• #free:checked ~ .both

• #free:checked ~ .parent_of_both .both

这意味着#free必须在流程中领先，.both在sibbling中或在#free的sibbling内。

标签和css隐藏无线电输入https://codepen.io/gcyrillus/pen/JFdEk的示例。

如果HTML与CSS选择器要求不匹配，则需要javaScript。