用jquery查找最后一个孩子答案

【问题标题】：Find last child with jquery用jquery查找最后一个孩子
【发布时间】：2013-10-28 22:53:10
【问题描述】：

我有一个由行组成的表。每行都有 id、data-parent 属性和存储在 data() 中的虚拟级别选项。顶级行没有父级和级别属性。我需要找到一个节点的最后一个子节点，例如：

<tr id="83" class=""></tr>
<tr id="91" class="successor" data-parent="83"></tr>
<tr id="93" class="successor" data-parent="91"></tr>
<tr id="92" class="successor" data-parent="91"></tr>
<tr id="94" class="successor" data-parent="92"></tr>
<tr id="133" class="successor" data-parent="83"></tr>
<tr id="134" class="successor rowselected" data-parent="83"></tr>

这看起来像

我需要确定第 1.1.1.1 行是否是 1.1 的最后一行。怎么做？尝试使用 nextAll 或 prevAll 选择器并按数据父级和级别对其进行过滤......但没有运气。谢谢。

【问题讨论】：

标签： jquery jquery-1.8

【解决方案1】：

一整天的挣扎使我找到了这个解决方案：找到与拖动行处于同一级别的行的顶部节点，并检查该元素是否在拖动元素之前。

function isLastChild(parent, target, dragged)
{
  var top_node  = target.prevUntil("tr[data-parent="+parent+"]").andSelf().prev().first();
  var child_nodes = top_node.nextUntil("#"+dragged.attr("id")).filter(function(){ return $(this).data("parent") == target.data("parent")});

 return (child_nodes.last().attr("id")==target.attr("id"));
}

【讨论】：

【解决方案2】：

您是否尝试过以下方法：

var lastTr = $('#TABLEID tr').last();

这应该找到当前表的最后一个<TR> 元素（标记为“TABLEID”）

有关jQuery.last()的更多信息，请查看here

【讨论】：

所有行都在 1 个表中。嵌套是在我写的其他属性的帮助下实现的。
抱歉，您需要找到与特定父项关联的最后一项吗？即您需要找到行 '91' 的所有子元素，因此它将返回 93 和 92。这个假设是否正确？
不完全是，ex 的第 1.1.1.1 行的 id 为 94，1.1.1.1 的父项是 92，它的父项是 91。所以我想知道第 1.1.1.1 行是否是最后一行节点 91 的列表。

【解决方案3】：

您的示例代码与您对virtual level option 的描述相冲突，如果您确实有virtual level option，那么这应该可以工作。如此处所示：http://jsfiddle.net/dBT3D/ 我已将 TR 更改为 DIV，因为 HTML 格式不正确会导致浏览器出现问题。

HTML：

<div id="83" class="">
    <div id="91" class="successor" data-parent="83" data-level="1">
        <div id="93" class="successor" data-parent="91" data-level="2"></div>
        <div id="92" class="successor" data-parent="91" data-level="2">
            <div id="94" class="successor" data-parent="92" data-level="3"></div>
        </div>
    </div>
    <div id="133" class="successor" data-parent="83" data-level="1"></div>
    <div id="134" class="successor rowselected" data-parent="83" data-level="1"></div>
</div>

JS：

$(document).ready(function () {
    deepestEl = {
        element: null,
        level: 0
    };
    $('.successor', '#83').each(function (index, el) {
        console.log(el);
        if ($(el).data('level') >= deepestEl.level) {
            deepestEl.element = el;
            deepestEl.level = $(el).data('level');
        }
    });

    console.log(deepestEl);
});

这将返回带有关卡和元素的deepestEl 对象。在此示例中，它将返回 {element: div#94.successor, level: 3}

【讨论】：

这是真的，但正如我所说的行没有嵌套在 html 中，所以选择器 $(".successor", "#id_row") 给出了空结果集。