jquery选择表中的输入框'；td'；直到下一个'；th'；

我动态创建了以下

表

（因此请不要介意值和表结构）

---

它不起作用

您可以添加组类或属性以使其更简单

$（函数（）{
//在init上：添加组属性
var cbClassCount=0；
$（“#tbl输入[type='checkbox']”）。每个（函数（）{
if（$（this）.parent（）.prop（“标记名”）=“TH”）{
cbClassCount++；
$（this.attr（“组”，cbClassCount）；
}否则{
$（this.attr（“组父级”，cbClassCount）；
}
});
//在复选框上单击-选中或取消选中子复选框
$（“#tbl th>输入[type='checkbox']”）。单击（函数（）{
$（“输入[组父项='”+$（此）.attr（“组”）+“]”].prop（'checked'，$（此）.prop（“checked”））；
});
//建议：您还可以添加下面的代码（可选）
//在TD复选框上单击-如果选中了所有子复选框，则更新父复选框。
$（“#tbl td>input[type='checkbox']”）。单击（函数（）{
if（$（$（输入[组父项='”+$（此）.attr（“组父项”）+“']）））.length==$（$（输入[组父项='”+$（此）.attr（“组父项”）+“]：选中”）.length）
$（“输入[组=”+$（this.attr（“组父级”）+“]”]）.prop（'checked'，true））；
else$（“输入[group=”+$（this.attr（“组父项”）+“]”）]）.prop（'checked'，false）；
});
});

财务
第一节
第2节
第三节
第四节
信息技术
第一节
您必须在行中循环，并不断检查下一行是否有第一个子TD，例如：


（函数（$）{
$（“#tbl”）。查找（'th>输入[type=“checkbox”]”）。单击（函数（）{
变量$this=$（this），
isChecked=$this.prop（“checked”），
行=$this.closest（“tr”）.next（）；
while（row.length&&row.children（“：first”）.prop（“标记名”）.toUpperCase（）=“TD”）{
var checkbox=row.find（'td>input[type=“checkbox”]”）；
复选框。道具（“已选中”，已选中）；
row=row.next（）；
}
})
})（jQuery）

财务
第一节
第2节
第三节
第四节
信息技术
第一节
我对jQuery代码做了一些更改，但没有涉及html


$（'#tbl tr th input[type=“checkbox”]'）。单击（函数（）{
var isChecked=$（this）.prop（“checked”）；
var pElem=$（this.parent（）.parent（）；
var nStopElem=pElem.nextAll（）.each（（indx，elem）=>{
if（$（elem）.find（“th”）.length==0）{
$（elem）.find（“input[type='checkbox']”）.prop（'checked'，isChecked）；
}
其他的
{
返回false；
}
});
});

财务
第一节
第2节
第三节
第四节
信息技术
第一节
考虑在表格中使用更好的结构

<table>
  <tbody>
    <tr><th>checkbox</th><th>heading 1</th></tr>
    <tr>...rows/cells...</tr>
  </tbody>
  <tbody>
    <tr><th>checkbox</th><th>heading 2</th></tr>
    <tr>...rows/cells...</tr>
  </tbody>
</table>


复选框标题1
…行/单元格。。。
复选框标题2
…行/单元格。。。

请注意，您可以拥有任意数量的
tbody
元素

一旦这个结构就位，您就可以简单地使用
.closest（“tbody”）.find（“td-input[type=checkbox]”
和。。。工作完成了
 您将无法使用
.nextUntil
，因为它只查看
此
的同级复选框。为什么不添加类组呢？TBH，鉴于您的结构，您最好只更改html，以便可以轻松识别
th
下的所有复选框，例如，通过向它们添加
数据组class='finance'
（大约），然后很容易用几行代码切换它们。你说html是动态生成的，你能更改html吗？谢谢大家………@nevildavid别忘了对任何你觉得有用的答案进行投票我不知道我们可以有
tbody
不止一次，这是一个很好的答案，可以很容易地在同一个gorup中选择元素谢谢你，哈伦，我从你的代码中学到了一些新东西。非常感谢您的代码。
$('#tbl tr th').find('input[type="checkbox"]').click(function () {
    var isChecked = $(this).prop("checked");

    $(this).nextuntil('#tbl tr th').each(function () {

        $('#tbl tr td').find('input[type="checkbox"]').prop('checked', isChecked);
    });
});

<table>
  <tbody>
    <tr><th>checkbox</th><th>heading 1</th></tr>
    <tr>...rows/cells...</tr>
  </tbody>
  <tbody>
    <tr><th>checkbox</th><th>heading 2</th></tr>
    <tr>...rows/cells...</tr>
  </tbody>
</table>