如何使用jQuery / javascript影响/选择Treetable插件的所有后代

时间:2013-07-10 19:58:11

标签: javascript jquery select treetable descendant

我的一段HTML代码如下所示:

<tr data-tt-id="1">
    <td>Parent</td>
</tr>
<tr data-tt-id="2" data-tt-parent-id="1">
    <td>Child 1</td>
</tr>
<tr data-tt-id="4" data-tt-parent-id="2">
    <td>Child 1's child</td>
</tr>
<tr data-tt-id="3" data-tt-parent-id="1">
    <td>Child 2</td>
</tr>
<tr data-tt-id="5" data-tt-parent-id="3">
    <td>Child 2's child</td>
</tr>

我正在选择具有data-tt-id =“1”的父级:

$('tr[data-tt-parent-id="1"]');

但无论树有多深,我都想要所有孩子和孩子的孩子。

正如您所看到的,data-tt-id是子级的唯一ID,而data-tt-parent-id是子级附加到的ID。

我正在考虑循环遍历每一个,但我不知道如何实现这一目标。 如何为data-tt-id设置为“1”的tr选择所有后代?

1 个答案:

答案 0 :(得分:4)

function getDescendants(el, curset) {
    curset = curset || $(""); // default to empty set
    var id = el.data('tt-id');
    var children = $("tr[data-tt-parent-id="+id+"]");
    if (children.length) {
        curset = curset.add(children);
        children.each(function() {
            curset = curset.add(getDescendants($(this), curset));
        });
    }
    return curset;
}

可能有更多惯用的方式来编写它,而不必在几个地方重新分配curset = ...,但这可行。

DEMO