Question

我正在尝试在选中单选按钮的文本时更改文本颜色（一组三个）。它不起作用。我尝试了多种变体，但这应该有效

$(document).ready(function() {
    if (
    $('.radioPanel [input:radio]').is(":checked")) {
        $(this).css('color', '#008000');
    }
});

这是aspx代码;是影响jquery更改的外部代码吗？

<fieldset class="registerradio">
                    <legend>Select a Category</legend>
                  <asp:Panel ID="radiobtnPanel" runat="server" CssClass="radioPanel">
                    <asp:RadioButton ID="radioUserEmployee" runat="server" GroupName="radioCreateUsers" Text="Employee" TextAlign="Left"  />
                    <asp:RadioButton ID="radioUserDistributor" runat="server" GroupName="radioCreateUsers" Text="Distributor" TextAlign="Left"/>
                    <asp:RadioButton ID="radioUserCustomer" runat="server" GroupName="radioCreateUsers" Text="Existing Customer" TextAlign="Left"/>
                    <%--<asp:RadioButton ID="radioUserOther" runat="server" GroupName="radioCreateUsers" Text="Other" TextAlign="Left"/>--%>
                  </asp:Panel>
 </fieldset>

这是小提琴; http://jsfiddle.net/6yVL3/

Answer 1

您的JavaScript中存在一些错误：

你在jsFiddle
您的选择器错误，[attr=value]，请检查列表here
您的JavaScript是静态的，这意味着您只检查一次收音机是否已检查，是否有更改，没有任何反应
您将颜色设置为收音机，而不是标签

以下是代码：

$(function() {
    // When the value of the radio change
    $('.radioPanel [type="radio"]').on('change', function() {
        $(this)
        .prev().css('color', 'red')
        .siblings().css('color', 'black');
    });
});

这是the live example。

Answer 2

试试这个：

$('.radioPanel input[type="radio"]').change(function() {
    if ($(this).is(':checked')) 
        $(this).prev('label').css('color', '#008000');
});

顺便说一句，您应该删除之前检查过的标签的颜色。像这样：

$('.radioPanel input[type="radio"]').change(function() {
    $('.radioPanel label').css('color', 'black');
    //This in result removes the color of the label checked previously, in fact it just resets all the color of labels to black
    if ($(this).is(':checked'))
       $(this).prev('label').css('color', 'green');
});

DEMO

Answer 3

您可以尝试this

$(document).ready(function() {

 $(".radioPanel :input:checked").prev('label').css('color', '#008000');

});

在jquery中更改选定的单选按钮文本颜色

3 个答案: