如何选择不同TD中的所有输入元素

Question

我在运行时创建了<table>。该表有三列：

1. 在第一个TD中始终存在<input type="checkbox">元素
2. 第二个TD并不重要
3. 在第三个TD中总是有一个HTML输入元素。这可以是<input>，<select>

当我点击第一个TD

上的复选框时，我需要启用/禁用第三个TD中的输入元素

我知道如何在复选框上绑定事件处理程序，但我不知道如何选择“所有<input>和<select>元素将在同一行但在第三行中TD “

这是我的样本标记

...
<tr>
    <td>
        <input id="chkSelectField" type="checkbox" name="chkSelectField" 
             onclick="disableControl('chkSelectField');" />
    </td>
    <td valign="top">&nbsp;</td>
    <td>
        <input name="control1" type="text" id="control1" />
        <input name="control2" type="text" id="control2" />
        <select name="control3" type="text" id="control3">...</select>
    </td>
</tr>

...

Answer 1

在点击处理程序中：

$(this).closest('tr').find('td:eq(2) :input')

Answer 2

在复选框的事件处理程序中，输入：

$(this).parent().next().next().find('input,select')

Answer 3

我会这样做：

$('td input:checkbox').click(function() {         
    var t = $(this);
    var inputs = $(this).closest('tr').find('td:eq(2) :input');
    if (t.is(':checked')) {
        inputs.attr('disabled', 'disabled');
    } else {
        inputs.removeAttr('disabled');         
    }
});

示例 - http://jsfiddle.net/R5Lck/1/