javascript - 使用 jQuery 显示/隐藏子节点

Question

我正在尝试根据缩进值显示子节点(如果选择的选项为"is")。 indent0->父节点，indent1 - 子节点。排序顺序是节点在数据库中的放置顺序。

$( "body" ).on( "click", ".js-show-aspects", function(event) {
    var displayLabel = $(this).data('meta-value');     
    var sort_order = $('.js-data-selector.active:first').data('sort-order');
    var indent = $('.js-data-selector.active:first').data('indent');
    var rowCount = $('#show_aspects td').length;

    for (var i=0;i<rowCount;i++)
    {
        var hasindent0 =$(this).next().hasClass("indent0");
        if((displayLabel=='Yes') && (hasindent0== false)) {
            child1 = $("table tr td").filter(function() {
                return $(this).prop("class").match(/indent/)});

                child = child1.addClass(function (index){ return "sort-order"+(sort_order+1)});
        }               
    }
});

---

HTML在下面的 html 中，$aspects 从数据库中获取所有节点，

<tbody>
    <? foreach($aspects as $a) { ?> 
        <tr id="show_aspects" class="js-data-selector 
            <?=($a['active'] == 0) ? "text-warning" :""; ?> "
            data-sort-order="<?= $a['sort_order'] ?>"
            data-indent="<?= $a['indent']?>" align="left"
            data-taxonomy-id="<?=$a['taxonomy_id']?>">

             <td class="indent<?=$a['indent']?> 
                 sort-order<?=$a['sort_order']?>"
                 data-indent="<?= $a['indent']?>">

                 <? if($a['active'] == 0) { 
                     echo '<strong class="pull-right text-warning">Inactive</strong>';
                 } ?>

                 <?=$a['aspect_label']?> : 
                 <span class="aspect-data" data-taxonomy-id="<?=$a['taxonomy_id']?>"></span>

             </td>
        </tr>
    <?}?>
</tbody>

但是我无法显示子节点。知道如何解决这个问题吗？

用 HTML 内容编辑问题..

Answer 1

很难准确理解您要对当前形式的问题做什么，但是如果您想使用 jQuery 隐藏或显示子节点，可以使用 $("#id").children().hide(); 和 $("#id").children().show();.
(其中“#id”是父 DOM 节点的 ID。)

children() 也将选择器作为参数，以防您只希望隐藏/显示特定的子项:http://api.jquery.com/children/

(如果你把问题弄清楚一点，就有可能给出更合适的答案)