如何获取具有特定子项的项目列表？答案

【问题标题】：How to get the list of items that have a particular subitem?如何获取具有特定子项的项目列表？
【发布时间】：2011-11-02 01:15:24
【问题描述】：

我有一个表格，其中每一行都以“复选框”开头，我想获取所有包含复选框的 TR 并且它是选中的。

类似这样的：

$('#' + tableId + ' > tbody > tr:contains(td > input[type=checkbox]:checked').each(function (i, item) {

        alert('delete ' + $(item).data('row-id'));

    });

该代码不起作用，它被卡住了。可能是因为“包含”选择器仅适用于文本。我该怎么办？

问候。

【问题讨论】：

注意tableId不能以数字开头，这可能会导致问题。

标签： jquery jquery-selectors html-table

【解决方案1】：

使用 jQuery 的has:

$('#' + tableId + ' > tbody > tr:has(td > input[type=checkbox]:checked)').each(function (i, item) {

  alert('delete ' + $(item).data('row-id'));

});

为了获得更好的性能（请参阅 jQuery API 文档），请使用：

$('#' + tableId + ' > tbody > tr')
.filter(':has(td > input:checkbox:checked)').each(function (i, item) {

  alert('delete ' + $(item).data('row-id'));

});

由于has查询不能通过querySelectorAll()运行，所以没有必要使用[type=checkbox]。

【讨论】：

它也卡住了，可能是什么问题？
原始代码中的has 和contains 缺少右括号。
@kingjiv：可能就是这样！已更新。

【解决方案2】：

您不需要:contains 选择器。

如果您希望它位于 <tr> 内的任何位置（甚至在嵌套元素内）

$('#' + tableId + ' > tbody > tr td > input[type=checkbox]:checked').each(function (i, item) {

如果你想直接在里面

$('#' + tableId + ' > tbody > tr > td > input[type=checkbox]:checked').each(function (i, item) {

【讨论】：

这两个都会遍历复选框。他想循环包含复选框的tr 元素。

【解决方案3】：

您可以抓住复选框，然后找到它们最近的tr：

$('#' + tableId + ' > tbody > tr > td > input[type=checkbox]:checked').closest("tr")

请注意，您还缺少) 来关闭contains。

【讨论】：

这段代码会查询 DOM 两次，这不是最好的办法……