1

我试图在选中时更改所选单选按钮文本上的文本颜色(一组三个)。它不起作用。我已经尝试了多种变体,但这应该可以工作

$(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/

4

3 回答 3

6

您的 JavaScript 中有一些错误:

  • 您在 jsFiddle 中设置 mootools 而不是 jQuery
  • 您的选择器错了,是,请在此处[attr=value]查看列表
  • 您的 JavaScript 是静态的,这意味着您只检查一次是否检查了收音机,如果有更改,则什么也没有发生
  • 您将颜色设置为收音机而不是标签

这是代码:

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

这是一个活生生的例子

于 2012-08-30T11:43:45.203 回答
3

试试这个:

$('.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');
});

演示

于 2012-08-30T11:43:08.673 回答
1

你可以试试这样

$(document).ready(function() {

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

});​
于 2012-08-30T11:50:22.650 回答