Question

我正在使用jquery来设置单选按钮的样式，但是如果有一个多个组则不起作用 - 这意味着现在只有一个元素被立即设置样式。

我在代码中有：

<script type="text/javascript">
    $(document).ready(function(){

        $(".RadioClass").change(function(){
            if($(this).is(":checked")){
                $(".RadioSelected:not(:checked)").removeClass("RadioSelected");
                $(this).next("label").addClass("RadioSelected");
            }
        });
    });
</script>

并在html中：

<input id="Radio1" type="radio" class="RadioClass" name="group1" >
<label id="Label1" for="Radio1" class="RadioLabelClass">Radio 1</label>
<input id="Radio2" type="radio" class="RadioClass" name="group2"/>
<label id="Label2" for="Radio2" class="RadioLabelClass">Radio 2</label>
<input id="Radio3" type="radio" class="RadioClass" name="group1"/>
<label id="Label3" for="Radio3" class="RadioLabelClass">Radio 3</label>

嗯，例如，我有group2，无线电图像不应该改变，因此对应于jquery。有关如何使其适用于不同组名的任何想法？

Answer 1

不太可靠的作品

$(".RadioClass").change(function(){ ...

更好地替换

$(".RadioClass").click(function(){ ...

Answer 2

试试这个，

$(".RadioClass").change(function(){
if($(this).is(":checked"))
{
    var groupName = $(this).attr("name");
    $(".RadioClass").each(function(idx)
     {
         if($(this).attr("name") == groupName)
         {
             $(this).next("label").removeClass("RadioSelected");
         }
     });


    $(this).next("label").addClass("RadioSelected");
}
});

编辑：我也意识到按名称选择元素可能更快。

$(".RadioClass").change(function(){
if($(this).is(":checked"))
{
    var groupName = $(this).attr("name");
    $("[name='"+groupName+"']").next("label").removeClass("RadioSelected");

    $(this).next("label").addClass("RadioSelected");
}
});

多个组的jquery单选按钮

2 个答案: