javascript - jQuery 1.9.1 中的单选按钮是否存在错误？

Question

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

但是，以下代码似乎无法在 Chrome/Firefox 中执行 jQuery 1.9.1 中预期的操作。

预期行为:单击包含单选按钮的 div -> 设置“选中”属性 -> 在 DOM 中呈现选中状态。

实际行为:单击包含单选按钮的 div -> 已设置“选中”属性 -> 在 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));
});