Question

如果选择了输入，我试图将CSS添加到label元素

我尝试过使用输入失败了：由于构建html的方式我检查+标签无法更改。

有没有人知道如何使用Javascript / Jquery或CSS？

<div class="radio-button-container">
    <div class="radio-button">
        <input type="radio" value="QUARTER" name="frequency" id="frequencyQUARTER">
    </div>
    <div class="radio-label">
    <label for="frequencyQUARTER">New Label</label>
    </div>
</div>

由于

Answer 1

$('#frequencyQUARTER').change(function(){
    if($('#frequencyQUARTER').is(':checked')){

        $('.radio-label').find('label').css({color:'red'});
    }
    else{
        $('.radio-label').find('label').css({color:'yellow'});
    }
});

html

<div class="radio-button-container">
    <div class="radio-button">
        <input type="radio" value="QUARTER" name="frequency" id="frequencyQUARTER">
    </div>
    <div class="radio-label">
    <label for="frequencyQUARTER">New Label</label>
    </div>
</div>

<强> DEMO

Answer 2

您可以在无线电更改事件中获取标签并相应地应用该课程。

首先将类删除到所有无线电同胞元素。

代码：

$(".radio-button-container input[type='radio']").on("change", function () {
    $(".radio-button-container input[type='radio']").each(function (i, e) {
        $("label[for='" + this.id + "'").removeClass("checked");
    });
    $("label[for='" + this.id + "'").addClass("checked");
});

演示：http://jsfiddle.net/5saLna0z/

将Jquery / JS添加到输入＆amp;标签

2 个答案: