Question

我一直在尝试用jQuery以编程方式选择单选按钮，我认为这就像更改checked属性一样简单。

但是，以下代码似乎没有按照Chrome / Firefox中jQuery 1.9.1的预期执行。

预期行为：点击包含单选按钮的div - ＆gt; 'checked'属性设置 - ＆gt;渲染在DOM中检查。

实际行为：点击包含单选按钮的div - ＆gt; 'checked'属性设置 - ＆gt;渲染在DOM中检查单击的第一个和第二个按钮，后续按钮不会呈现为已选中。

jQuery的：

$('div.form-type-radio').on('click', function () {    
    var Id = $(this).find('input[type=radio]').attr('id');   
    $('form input[type=radio]:not(#'+Id+')').removeAttr('checked');   
    $('#' + Id).attr('checked', 'checked');    
    console.log($('#' + Id));    
});

这是一个jsFiddle - http://jsfiddle.net/GL9gC/

我已经尝试了与之前版本的jQuery相同的代码，它们都按预期工作。

Answer 1

在这种情况下，您应该使用prop()代替attr() / removeAttr()。

这是一个有效的jsFiddle。

<强> jQuery的：

$('div.form-type-radio').on('click', function () {
    var Id = $(this).find('input[type=radio]').prop('id');
    $('form input[type=radio]:not(#'+Id+')').prop('checked');
    $('#' + Id).prop('checked', 'checked');
    console.log($('#' + Id));
});

Answer 2

的 LIVE DEMO

$('div.form-type-radio').on('click', function () { $(this).find(':radio').prop({checked: true}); });

http://api.jquery.com/prop/

jQuery 1.9.1中的单选按钮是否有错误？

2 个答案: