0

nested lists在我的 HTML 页面中有这些列表由 jQuery 代码管理,该代码为用户提供了将行和子节点添加到列表节点的交互。每个列表都可以包含一个div用于添加新列表作为子列表。我的问题是我想在我可以创建的元素的深处添加一个动态限制器:

<ul>
    <li>
        <ul>
            <li><div class="add-child"></div></li>
            <li><div class="add-child"></div></li>
            <li><div class="add-row"></div></li>
        </ul>
    </li>
    <li><div class="add-child"></div></li>
    <li><div class="add-child"></div></li>
    <li><div class="add-row"></div></li>
</ul>

未来可能会发生变化,我知道如果我想使用这样的静态选择器,我可以简单地使用a max of 3 levels of deepness

$('li li li .add-child').remove();

但我想要一个动态解决方案来通过 PHP 设置深度,然后通过 jQuery 限制它,我的方法怎么可能呢?

4

2 回答 2

3
$('.add-child')
    .filter(function(){
        return $(this).parents('li').length > 2;
    })
    .remove();

我知道,你说你不需要插件,但我无法抗拒:D

$.fn.filterIfHasNParents = function(n, selector){
    var depth = n || 1;
    return $(this).filter(function(){
        return $(this).parents(selector || '').length > depth - 1;
    });
}

然后将其用作:

$('.add-child').filterIfHasNParents(3, 'li').remove();
于 2013-01-01T18:17:21.427 回答
2

你的意思是这样的?

$( '.add-child' ).each( function() {
    if( $( this ).parents( 'li' ).length > someDepthSetByPHP )
    {
        $( this ).remove();
    }
} );

jsfiddle 示例

于 2013-01-01T18:17:34.903 回答