Question

我有一些子元素列表，需要根据它们的任何类与其父类的匹配进行过滤。

父和子元素在理论上可以有任意数量的类。

基本上，如果孩子没有父母也有的班级，则需要隐藏。

每种情况下的类都是未知的，因此我无法定位任何特定的类名。

我的标记示例：

<ul id="mylist" class="class1 class2">
    <li class="class1">This should be visible (class1)</li>
    <li class="class2">This should be visible (class2)</li>
    <li class="class1 class2">This should be visible (class1 class2)</li>
    <li class="class3 class2 class1">This should be visible (class3 class2 class1)</li>
    <li class="class2 class3">This should be visible (class2 class3)</li>
    <li class="class3 class4">This should be hidden (class3 class4)</li>
    <li class="class3">This should be hidden (class3)</li>
    <li class="class4">This should be hidden (class4)</li>
</ul>

到目前为止，我已经达到了这个目标：

$('#mylist li').each(
function(i) {
    var classes = this.className.split(/\s+/);
    for (var i=0,len=classes.length; i<len; i++){
        if (!$('#mylist').hasClass(classes[i])){
            $(this).hide();
        }
    }
});

逻辑中的某些东西并不完全正确。我有正确的结果，例如：

<li class="class1">This is visible</li>
<li class="class2">This is visible</li>
<li class="class1 class2">This is visible</li>

但不是因为：

<li class="class3 class2">This should be visible</li>

这是一个小提琴：http://jsfiddle.net/455qdrn8/

Answer 1

我认为你应该做的是展示与父母有共同类的元素

var $lis = $('#mylist li'),
    classes = $.map($('#mylist').attr('class').split(/\s+/), function (value) {
        return '.' + value
    });

$lis.hide().filter(classes.join()).show();

演示：Fiddle

jQuery：显示与其父类/ es匹配的class / es的子元素

1 个答案: