javascript - 如何根据单选按钮选择在表格中切换多个输入

Question

假设以下html：

<tr>
    <td>
        <label for="c1_testRdio">Have you taken any tests in this class?:</label>
        <br>
        <label>Yes<input type="radio" class="testRdio" name="c1_testRdio" value="Yes"></label>
        <label>No <input type="radio" class="testRdio" name="c1_testRdio" value="No" checked></label>
        <label>How Many? <input type="text" class="howManyTests" name="c1_howManyTests" disabled></label>
    </td>
    <td>
        <label for="c1_whatGradesTests">What were your grades?:</label><br>
        <input type="text" name="c1_whatGradesTests" disabled>
    </td>
</tr>

如果选择了 radio with value="Yes"，什么 jQuery（1.5 兼容）代码将启用 2 个文本输入，c1_howManyTests以及c1_whatGradesTests？

试过：

$('.testRdio').change(function(){
    //var txt = $(this).closest("td").next("td").children('.howManyTests');
    var txt = $(this).parent().next('label>input[type="text"]');
    console.log(txt.id);
    this.value == 'No' ? txt.removeAttr('disabled') : txt.attr('disabled', 'disabled');
});

Answer 1

尝试这个：

$('.testRdio').change(function () {
    $(this).closest('tr').find('input[type="text"]').attr('disabled', this.value === 'No');
});

没有 prop 的较旧 jq 版本attr（也用于完成 prop 的工作）用于将 bool 值用于禁用。

演示

此外，我还必须大量修复您的标记（现在我已经在问题中看到它已修复）

Answer 2

$('.testRdio').change(function(){
   $(this).closest('tr').find('input[type="text"]').attr('disabled',$(this).val()=="No");
});

jsFiddle 示例

Answer 3

你的代码有点乱，所以我重建了它：http: //jsfiddle.net/QgJac/1/

我认为隐藏整体div更好。如果他们选择“否”，他们实际上并不需要查看这些问题。