1

我在表格中有这样的单选按钮

<form>
    <table class="table table-hover flights_table">
        <tr>
            <td>
                <input type="radio" class="flight" name="flight" />
            </td>
            <td>Fare type</td>
            <td>Price</td>
            <td>dep</td>
            <td>Arrival</td>
        </tr>
        <tr>
            <td>
                <input type="radio" class="flight" name="flight" />
            </td>
            <td>Fare type</td>
            <td>Price</td>
            <td>dep</td>
            <td>Arrival</td>
        </tr>
        <tr>
            <td>
                <input type="radio" class="flight" name="flight" />
            </td>
            <td>Fare type</td>
            <td>Price</td>
            <td>dep</td>
            <td>Arrival</td>
        </tr>
    </table>
</form>

和 jQuery 代码

$('.flights_table tr').click(function (e) {
    //$('.flight').attr('checked', false);
    $(this).find('.flight').attr('checked', true);
});

目的是在单击它所在的行时选择一个收音机,它可以工作,但每个收音机只有一次。

例如,您选择第 1 个,然后单击第 2 个,如果您尝试再次选择第 1 个,则它不起作用。

我使用的解决方案被接受为在这个问题中工作,但不再完美工作。

我也尝试使用 removeAttr 代替注释行相同的结果。

http://jsfiddle.net/NsDnh/

4

3 回答 3

2

尝试这个

 $('tr').click(function (e) {
 $(this).$(input:radio).prop('checked', true);
});
于 2013-04-13T03:53:43.500 回答
1

问题是attr()与 jQuery 版本 1.9+ 的不兼容问题。

从 jQuery 1.6 开始,.attr() 方法为尚未设置的属性返回 undefined。要检索和更改 DOM 属性,例如表单元素的选中、选择或禁用状态,请使用 .prop() 方法。

尝试使用prop代替:

 $('.flights_table tr').click(function (e) {
     //$('.flight').attr('checked', false);
     $(this).find('.flight').prop('checked', true);
 });

Updated Demo

于 2013-04-13T03:48:21.697 回答
0

试试下面的代码。

   $(this).find('.flight').prop('checked', true);

jsFiddle

于 2013-04-13T03:52:10.830 回答