如何使用Jquery在HTML表格的点击表格行中选择元素？

Question

我有一个具有2列的表，我正在使用PHP动态生成该表的行。 每个表格行都有以下字段：

• 输入类型=“复选框”
• div中的两个输入type =“ text”

我想做的是在选中复选框时隐藏包含两个输入类型文本的div，我尝试使用Jquery获取被单击复选框的父级，然后将相应的div隐藏在当前<tr>但它不起作用。

这是HTML代码，用于查看如何生成我的表：

<table>

<tr>
    <th>Hide?</th>
    <th>Inputs</th>
</tr>

<tr>
    <td>
        <input type="checkbox" name="checkBoxes[]">
    </td>
    <td>
        <div class="two-inputs">
            <input type="text" name="inputs[]">
            <input type="text" name="inputs[]">
        </div>
    </td>

</tr>

<tr>
    <td>
        <input type="checkbox" name="checkBoxes[]">
    </td>
    <td>
        <div class="two-inputs">
            <input type="text" name="inputs[]">
            <input type="text" name="inputs[]">
        </div>
    </td>

</tr>

Answer 1

尝试这个。 jsfiddle

$("input:checkbox").click(function(){
   if(this.checked){
      $(this).parent().next().find("div").hide();
   }  
    else{
             $(this).parent().next().find("div").show();
    }

});

Answer 2

$('input:checkbox').click(function() {
    if (!$(this).is(':checked')) {
        $(this).parent().next('.two-inputs').hide();
    }
});