单选按钮选中状态的jQuery

这是基本的代码单选按钮选中状态的jQuery

<ul> 
<li> 
    <input type="radio" name="r" value="a" id="a" checked="checked" /> 
    <label for="a">A</label> 
</li> 
<li> 
    <input type="radio" name="r" value="b" id="b" /> 
    <label for="b">B</label> 
</li> 
</ul>

所以我需要把它作为工作：

1单击<标签>，并检查同级<无线电>是检查= "检查"然后添加"选择"类到母体<利>

2单击<标签>和检查兄弟<无线电>未被选中，然后放入托运= "检查"到同级<无线电>并添加"选择"类父<李>也删除所有其他"在< UL检查"和"选择" >

你能帮我请！

来源

2010-10-22 Stickers

点击标签应该在浏览器中自动检查单选按钮。所以，你只需要添加一个点击事件到标签/输入，将设置在李的类。

像这样的东西应该工作：
HTML（我只是说id="mylist"）

<ul id="mylist"> 
<li> 
    <input type="radio" name="r" value="a" id="a" checked="checked" /> 
    <label for="a">A</label> 
</li> 
<li> 
    <input type="radio" name="r" value="b" id="b" /> 
    <label for="b">B</label> 
</li> 
</ul>

的JavaScript

$(function() { 
$("#mylist input, #mylist label").click(function() { 
    $("#mylist li").removeClass("selected"); 
    $(this).parent().addClass("selected"); 
}); 
});

来源

2010-10-22 04:09:06

我确定这不是最优雅的方式，但是对标记进行了更改（向您的li添加类“a”和“b” - 基本上与radio elem的id相同）在这里我们去：

$('label').click(function(){ 
    // if the radio is already checked 
    if ($('#'+$(this).attr('for')).attr('checked') == 'checked') { 
     $('ul li').removeClass('selected'); // remove previous selected items 
     $('.'+$(this).attr('for')).addClass('selected'); // add new selected item 
    } else { 
     // radio not checked 
     $('#'+$(this).attr('for')).attr('checked','checked'); // check radio (altough this should be automatic, without js 
     $('ul li').removeClass('selected'); // clear previous selected items 
     $('.'+$(this).attr('for')).addClass('selected'); // add new selected item 
    } 
});

对于速度，我建议增加一个ID，UL，说 “清单”，并有从

$('label').click(function(){

到

$('#list label').click(function(){

的代码更改

此外，从：

$('ul li').removeClass('selected'); // remove previous selected items

到

$('#list li').removeClass('selected'); // remove previous selected items

祝你好运！

来源

2010-10-22 04:04:25 Claudiu

既然你已经使用label与for属性有应该真的不需要附加一个事件到label元素，除非你需要与IE6抗衡使你生活困难。

$(':radio[name="r"]').change(function(){ 
    $(this).parent('li').addClass('selected').siblings().removeClass('selected'); 
}).filter(':checked').change();

文档为：change()

参见：http://www.jsfiddle.net/yijiang/mzPk9/

来源

2010-10-22 04:13:08

单选按钮选中状态的jQuery

回答

相关问题